FlyBanner 自动循环轮播图,XBanner 轮播图(允许图片之间有间隔)

先上效果图
FlyBanner 自动循环轮播图,XBanner 轮播图(允许图片之间有间隔)
上面的是XBanner的效果,下面的是FlyBanner的效果

FlyBanner
使用FlyBanner轮播图,先添加依赖
在module的build.gradle中添加

implementation 'com.recker.flybanner:flybanner:1.3'

在XML文件中的控件

<com.recker.flybanner.FlyBanner
        android:id="@+id/send_flybanner"
        android:layout_width="match_parent"
        android:layout_height="200dp"></com.recker.flybanner.FlyBanner>

在Activity里的代码如下

public class MainActivity extends AppCompatActivity {
    //存放图片
    private List<Integer> mImages = new ArrayList<>();
    //使用本地的图片
    private Integer[] image = new Integer[]{R.mipmap.a, R.mipmap.d, R.mipmap.c, R.mipmap.d, R.mipmap.c};
    //控件
    private FlyBanner send_flybanner;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        //将本地的图片添加到集合中
        for (int i = 0; i < image.length; i++) {
            mImages.add(image[i]);
        }
        //这个方法是展示本地的图片
        send_flybanner.setImages(mImages);
        //这个方法是用来展示网络请求接口的数据
        send_flybanner.setImagesUrl();
    }

    private void initView() {
        send_flybanner = (FlyBanner) findViewById(R.id.send_flybanner);
    }
}

XBanner

先在module的build.gradle中添加依赖,因为展示图片是通过glide来展示的,所以添加了glide的依赖,也可以使用其他的图片加载框架来展示

implementation 'com.github.xiaohaibin:XBanner:1.6.1'
implementation 'com.github.bumptech.glide:glide:4.9.0'

在项目的build.gradle里添加

allprojects {
    repositories {
        google()
        jcenter()
        //添加这一个代码
        maven { url 'https://jitpack.io' }
    }
}

在XML文件中的控件

<com.stx.xhb.xbanner.XBanner
        android:id="@+id/send_xbanner"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:clipChildren="false"
        app:AutoPlayTime="3000"        //循环图片的时间间隔
        app:clipChildrenLeftRightMargin="20dp"  //设置与前一张和后一张的间距
        app:isClipChildrenMode="true"   //是否允许展示为有间距的轮播图,若为false效果则与FlyBanner效果一致,这个不设置为true,那么设置的间距就无效果
        app:isShowNumberIndicator="true"   //是否显示页数
        ></com.stx.xhb.xbanner.XBanner>

在Activity中的代码

    public class MainActivity extends AppCompatActivity {
        //存放图片
        private List<Integer> mImages = new ArrayList<>();
        //使用本地的图片
        private Integer[] image = new Integer[]{R.mipmap.a, R.mipmap.d, R.mipmap.c, R.mipmap.d, R.mipmap.c};
        //控件
        private XBanner send_xbanner;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            initView();
            //将本地的图片添加到集合中
            for (int i = 0; i < image.length; i++) {
                mImages.add(image[i]);
            }
            //设置数据
            send_xbanner.setData(mImages, null);
            //通过Glide将图片加载,也可以使用其他的图片加载框架
            send_xbanner.loadImage(new XBanner.XBannerAdapter() {
                @Override
                public void loadBanner(XBanner banner, Object model, View view, int position) {
                    Glide.with(MainActivity.this).load(mImages.get(position)).into((ImageView) view);
                }
            });
            //页面改变时间在这里插入图片描述
            send_xbanner.setPageChangeDuration(1000);
            //页面循环到中间时,图片不放大,若想放大则注释此行
            send_xbanner.setPageTransformer(Transformer.Default);
            //点击事件
            send_xbanner.setOnItemClickListener(new XBanner.OnItemClickListener() {
            @Override
            public void onItemClick(XBanner banner, Object model, View view, int position) {
                Toast.makeText(MainActivity.this, "点击了第" + position![在这里插入图片描述](https://img-blog.****img.cn/20190312195949529.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzk0MjQzMA==,size_16,color_FFFFFF,t_70) + "张图片", Toast.LENGTH_SHORT).show();
            }
        });
        }
    
        private void initView() {
            send_xbanner = (XBanner) findViewById(R.id.send_xbanner);
        }
    }

FlyBanner 自动循环轮播图,XBanner 轮播图(允许图片之间有间隔)

当Activity失去焦点时立即停止自动轮播;当Activity获得焦点时才开始自动轮播。代码如下:(会有一些更好的体验)

@Override
    protected void onResume() {
        super.onResume();
        banner.startAutoPlay();
    }

    @Override
    protected void onStop() {
        super.onStop();
        banner.stopAutoPlay();
    }