Realization of Android Banner carousel frame

(1) Introduce banner dependency

Gradle
dependencies {
    ...
    //轮播图依赖
    implementation 'com.youth.banner:banner:1.4.9'
    //glide框架依赖
    implementation 'com.github.bumptech.glide:glide:4.6.1'
}

(2) Add network permissions

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

(3) Layout file

<com.youth.banner.Banner
        android:id="@+id/banner"
        android:layout_width="match_parent"
        android:layout_height="200dp" />

(4) Activity

import android.content.Context;
import android.os.Bundle;

import androidx.fragment.app.Fragment;

import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.youth.banner.Banner;
import com.youth.banner.BannerConfig;
import com.youth.banner.listener.OnBannerListener;
import com.youth.banner.loader.ImageLoaderInterface;

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

public class HomeFragment extends Fragment implements OnBannerListener {
    private Banner banner;
    private List<Integer> image = new ArrayList<>();
//    private List<String> titles = new ArrayList<>();

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View view = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_home, container, false);
        banner = view.findViewById(R.id.banner);

        initData();
        initView();

        return view;
    }

    private void initData() {
        image.clear();
//        titles.clear();
        image.add(R.drawable.one);
        image.add(R.drawable.two);
        image.add(R.drawable.three);
//        titles.add("山喜欢");
//        titles.add("水喜欢");
//        titles.add("人说的话也喜欢");
    }

    private void initView() {
        //设置指示器位置，小点点
//        banner.setIndicatorGravity(BannerConfig.CENTER);
        //设置图片加载器
        banner.setImageLoader(new MyImageLoader());
        //设置图片集合
        banner.setImages(image);
//        banner.setBannerTitles(titles);
        //设置banner动画效果
//        banner.setBannerAnimation(Transformer.Default);
        //设置是否为自动轮播，默认是“是”
        banner.isAutoPlay(true);
        //设置内置样式,不显示title和小点点指示器
        banner.setBannerStyle(BannerConfig.NOT_INDICATOR);
        //设置轮播时间
        banner.setDelayTime(3000);
        //轮播图的监听
        banner.setOnBannerListener(this);
        //banner设置方法全部调用完毕时最后调用
        banner.start();
    }

    //轮播图监听方法
    @Override
    public void OnBannerClick(int position) {
        Log.i("tag", "你点了第"+position+"张轮播图");
    }


    //图片加载器
    private class MyImageLoader implements ImageLoaderInterface {
        @Override
        public void displayImage(Context context, Object path, View imageView) {

            Glide.with(context).load(path).into((ImageView) imageView);
        }

        @Override
        public View createImageView(Context context) {
            return null;
        }
    }
}

Effect picture (I don’t know why the recorded picture keeps flashing, but it’s actually good):

 By the way, introduce the commonly used methods, properties and constants of Banner

(1) Method

method name	describe
setBannerStyle(int bannerStyle)	Set the carousel style (default is CIRCLE_INDICATOR)
setIndicatorGravity(int type)	Set the position of the indicator (the default is right if there is no title, and the left is default if there is a title)
isAutoPlay(boolen isAutoPlay)	Set whether to automatically rotate (default automatic)
startAutoPlay()	start carousel
stopAutoPlay()	end carousel
star()	Start banner rendering
setOffscreenPageLimit(int limit)	Same as viewpager method
setBannerTitles(List titles)	Set the corresponding title and picture to be displayed in the carousel (the title will not be displayed by default if it is not passed)
setDelayTime(int time)	Set the carousel image interval time (in milliseconds, the default is 2000)
setImages(Object[]/List<?>imagesUrl)	Set carousel pictures (all parameter setting methods are executed before this method)
setImages(Object[]/List<?>imagesUrl,OnLoadImageListener linstener)	Set carousel pictures and customize picture loading method
setOnBannerClickListener(this)	Set the click event, the subscript starts from 1
setOnLoadImageLinstener(this)	Set the image loading event, you can customize the image loading method
setImageLoader(Object implements ImageLoader)	Set image loader
setOnPageChangeListener(this)	Set the sliding monitor of viewpager
setBannerAnimation(Class<? extends PageTransformer> transformer)	Set the default animation of the viewpager
setPageTansformer(boolean reverseDrawingOrder,ViewPager.PageTransformer transformer)	Set custom animation for viewpager

(2) Attributes attribute (called in the banner layout file):

Attributes	form	describe
delay_time	integer	Carousel execution time, default 2000
is_auto_play	boolean	Whether to rotate automatically, the default is true
title_background	color	reference
title_textColor	color	title font color
title_textsize	dimension	title font size
title_height	dimension	title bar height
indicator_width	dimension	The width of the indicator circular button
indicator_height	dimension	The height of the indicator circular button
indicator_margin	dimension	spacing between indicators
indicator_drawable_selected	reference	The effect of indicator selection
indicator_drawable_unselected	reference	Indicator unchecked effect
image_scale_type	enum	Same as scaleType of imageview

(3) Constants:

constant name	describe	Affiliation method
BannerConfig.NOT_INDICATOR	Don't show indicator and title	setBannerStyle
BannerConfig.CIRCLE_INDICATOR	Show circular indicator	setBannerStyle
BannerConfig.NUM_INDICATOR	Show digital indicator	setBannerStyle
BannerConfig.NUM_INDICATOR_TITLE	Show numeric indicator and title	setBannerStyle
BannerConfig.CIRCLE_INDICATOR_TITLE	Show circular indicator and title (vertical display)	setBannerStyle
BannerConfig.CIRCLE_INDICATOR_TITLE_INSIDE	显示圆形指示器和标题(水平显示)	setBannerStyle
BannerConfig.LEFT	指示器居左	setIndicatorGravity
BannerConfig.CENTER	指示器居中	setIndicatorGravity
BannerConfig.RIGHT	指示器居右	setIndicatorGravity

（四）动画常量( setBannerAnimation调用)：

Transformer.Default	Transformer.Accordion	Transformer.BackgroundToForeground
Transformer.CubeIn	Transformer.CubeOut	Transformer.DepthPage
Transformer.FlipVertical	Transformer.RotateDown	Transformer.RotateUp
Transformer.Stack	Transformer.Tablet	Transformer.ZoomIn
Transformer.ZoomOutSlide