Android---Banner carousel

Carousels are a very common UI. The Banner framework can help us develop quickly and meet the needs of the carousel image effect on the homepage.

1. Import Banner dependencies

implementation 'io.github.youth5201314:banner:2.2.2'

2. Activity_main.xml layout.

banner_loop_time: Set the carousel interval time, the default is 3000; banner_radius: Set the rounded corners of the carousel

<com.youth.banner.Banner
    android:id="@+id/main_banner"
    android:layout_width="match_parent"
    android:layout_height="210dp"
    app:banner_radius="15dp"
    android:layout_marginTop="15dp"
    android:layout_marginStart="10dp"
    android:layout_marginEnd="10dp"
    app:banner_loop_time="2000"
    />

 

3. Set the Banner adapter .

To achieve a simple carousel effect, the Banner framework has already made an adapter for us -- BannerImageAdapter , which can be used directly.

Banner.setAdapter(new BannerImageAdapter(data))

banner.setAdapter(new BannerImageAdapter<Integer>(banner_data) {

            @Override
            public void onBindView(BannerImageHolder holder, Integer data, int position, int size) {
                holder.imageView.setImageResource(data);
            }
        });

 

data is the data (picture) to be rotated, placed under the drawable folder. code for initial data

private void initData(){
        banner_data = new ArrayList<>();
        banner_data.add(R.drawable.banner001);
        banner_data.add(R.drawable.banner002);
        banner_data.add(R.drawable.banner003);
        banner_data.add(R.drawable.banner004);
        banner_data.add(R.drawable.banner005);
        banner_data.add(R.drawable.test006);
    }

4. Common property settings

 Set auto loop playback; true == autoplay

Banner.isAutoLoop(true);

 set indicator

Banner.setIndicator(new CircleIndicator(this))

   Set the color of the indicator when selected (that is, the color of the small point when selected)

Banner.setIndicatorSelectedColor(Color.GREEN)

   Sets the distance between indicators

Banner.setIndicatorSpace(int)

 

full code

package com.example.bannertest;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;

import com.youth.banner.Banner;
import com.youth.banner.adapter.BannerImageAdapter;
import com.youth.banner.holder.BannerImageHolder;
import com.youth.banner.indicator.CircleIndicator;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

    private Banner banner;
    private List<Integer> banner_data;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initData();
        banner = findViewById(R.id.main_banner);

        banner.setAdapter(new BannerImageAdapter<Integer>(banner_data) {

            @Override
            public void onBindView(BannerImageHolder holder, Integer data, int position, int size) {
                holder.imageView.setImageResource(data);
            }
        });

        // 开启循环轮播
        banner.isAutoLoop(true);
        banner.setIndicator(new CircleIndicator(this));
        banner.setScrollBarFadeDuration(1000);
        // 设置指示器颜色(TODO 即选中时那个小点的颜色)
        banner.setIndicatorSelectedColor(Color.GREEN);
        // 开始轮播
        banner.start();
    }

    private void initData(){
        banner_data = new ArrayList<>();
        banner_data.add(R.drawable.banner001);
        banner_data.add(R.drawable.banner002);
        banner_data.add(R.drawable.banner003);
        banner_data.add(R.drawable.banner004);
        banner_data.add(R.drawable.banner005);
        banner_data.add(R.drawable.test006);
    }
}