ViewPager实现无限轮播

前言

在Android开发过程中，我们偶尔会用到无限轮播的效果，一般我们都是用ViewPager实现。为了使用方便起见，我将ViewPager实现无限轮播效果封装成一个自定义轮播控件 — LoopView。下面就来讲讲LoopView的使用吧。

今天涉及内容：

1. LoopView公开方法简介
2. LoopView在MainActivity中的使用
3. 效果图和项目结构图
4. LoopView源码

先来波效果图

1.gif

一. LoopView公开方法简介

LoopView作为一个轮播控件，具备以下公开方法：

    /**
     * 自定义图片加载
     **/
    public void setOnImageLoadListener(OnImageLoadListener listener) ;

   /**
     * 设置轮播点击事件
     **/
    public void setOnLoopClickListener(OnLoopClickListener listener)

    /**
     * 设置轮播时间间隔
     * 注：必须在setData(List<Integer> datas)之前调用
     *
     * @param delayTime
     */
    public void setDelayTime(long delayTime)

    /**
     * 设置数据源
     **/
    public void setData(List<ImageData> datas)

二.LoopView在MainActivity中的使用

在MainActivity中使用的时候，先在MainActivity的布局activity_main.xml中引入控件：

    <com.example.function.LoopView
        android:id="@+id/loopview"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:layout_marginTop="20dp"
        app:layout_constraintTop_toBottomOf="@+id/btn"/>

在MainActivity中初始化LoopView

private LoopView mLoopView;

mLoopView= findViewById(R.id.loopview);

其他声明的数据

    private int mImageIds[]=new int[]{R.drawable.ic_pic1,R.drawable.ic_pic2, R.drawable.ic_pic3, R.drawable.ic_pic4,R.drawable.ic_pic5};
    private String mImageUrls[]=new String[]{"","", "", "",""};

在MainActivity的onCreate方法中设置LoopView相关

        List<LoopView.ImageData>list=new ArrayList<>();

        //制造数据
        for (int i = 0; i < mImageIds.length; i++) {
            LoopView.ImageData imageData=new LoopView.ImageData();
            imageData.setId(mImageIds[i]);
            imageData.setUrl(mImageUrls[i]);
            list.add(imageData);
        }
        //必须在setData之前设置(不设置的话，默认是3000毫秒，即3秒)
        mLoopView.setDelayTime(2500);
        //urls是图片的地址
        mLoopView.setData(list);
        //自定义加载
        mLoopView.setOnImageLoadListener(new LoopView.OnImageLoadListener() {
            @Override
            public ImageView getImageView(ImageView imageView, int position) {
                //自定义其他加载图片方式(如glide,ImageLoader等)
                //......
                //自定义加载完毕后，需要返回imageView
                //return imageView;
                return null;
            }
        });

        //设置点击图片事件的监听器
        mLoopView.setOnLoopClickListener(new LoopView.OnLoopClickListener() {
            @Override
            public void onLoopClick(int position) {
                if (list!= null && list.size() > 0) {
                    //用position去加载对应的数据即可
                    LogUtil.i("=====mLoopView点击了第====="+position);

                    ToastUtil.shortShow("=====mLoopView点击了第====="+position);
                }
            }
        });

注意， mLoopView.setData(list);中放到list中的对象全为LoopView.ImageData，即你ImageView要显示的数据，需要封装成LoopView.ImageData对象。
ok，现在贴出MainActivity全代码：

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private TextView mTv;
    private Button mBtn;


    private int mImageIds[]=new int[]{R.drawable.ic_pic1,R.drawable.ic_pic2, R.drawable.ic_pic3, R.drawable.ic_pic4,R.drawable.ic_pic5};
    private String mImageUrls[]=new String[]{"","", "", "",""};
    private LoopView mLoopView;

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

        initData();
        setListener();
    }

    private void initData(){
        mTv = findViewById(R.id.tv);
        mBtn = findViewById(R.id.btn);

        mLoopView= findViewById(R.id.loopview);
        List<LoopView.ImageData>list=new ArrayList<>();

        //制造数据
        for (int i = 0; i < mImageIds.length; i++) {
            LoopView.ImageData imageData=new LoopView.ImageData();
            imageData.setId(mImageIds[i]);
            imageData.setUrl(mImageUrls[i]);
            list.add(imageData);
        }
        //必须在setData之前设置(不设置的话，默认是3000毫秒，即3秒)
        mLoopView.setDelayTime(2500);
        //urls是图片的地址
        mLoopView.setData(list);
        //自定义加载
        mLoopView.setOnImageLoadListener(new LoopView.OnImageLoadListener() {
            @Override
            public ImageView getImageView(ImageView imageView, int position) {
                //自定义其他加载图片方式(如glide,ImageLoader等)
                //......
                //自定义加载完毕后，需要返回imageView
                //return imageView;
                return null;
            }
        });

        //设置点击图片事件的监听器
        mLoopView.setOnLoopClickListener(new LoopView.OnLoopClickListener() {
            @Override
            public void onLoopClick(int position) {
                if (list!= null && list.size() > 0) {
                    //用position去加载对应的数据即可
                    LogUtil.i("=====mLoopView点击了第====="+position);

                    ToastUtil.shortShow("=====mLoopView点击了第====="+position);
                }
            }
        });
    }

    private void setListener() {
        mBtn.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn:
                //新建通知
                startActivity(new Intent(MainActivity.this,TestActivity.class));
                break;
            default:
                break;
        }
    }
}

三.效果图和项目结构图

效果图

1.gif

项目结构图

image.png

四.LoopView源码

下面贴出LoopView源码源码：