无限循化Banner, ViewPager的两种实现方法

无限循环ViewPager效果图(设置了PageTransFormer,实现了画廊效果的):

方法一:

在源数据列表头和尾分别补上两个元素, 比如我们源数据列表顺序是[1,2,3], 真正使用到ViewPager中的列表变成[2,3,1,2,3,1,2]

源代码如下:

首先是xml文件, 为了实现"画廊"效果, ViewPager不能match_parent, 且在ViewPager父布局要设置 clipChildren="false"

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorWhite"
    android:clipChildren="false"
    tools:context="com.test.demoone.banner.BannerActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_centerHorizontal="true"
        android:background="@color/colorSeparate"
        android:clipChildren="false" />

    <View
        android:id="@+id/viewPagerHelper"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_centerHorizontal="true"
        android:clickable="true"
        android:focusable="true"
        android:visibility="gone" />

    <Button
        android:id="@+id/buttonChangeData"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/viewPager"
        android:onClick="changeData"
        android:text="change data" />

    <Button
        android:id="@+id/buttonTurnNext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/buttonChangeData"
        android:onClick="turnNext"
        android:text="turn next" />

</RelativeLayout>

接下来是Activity中的代码:

public class BannerActivity extends AppCompatActivity {

    private BannerAdapter adapter;
    private ViewPager viewPager;
    private List<String> dataList;
    private ZoomOutTransformer zoomOutTransformer;
    private boolean needToChangePosition = false;
    private View viewPagerHelper;

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


        dataList = new ArrayList<>();
        for (int i = 0; i < 1; i++) {
            dataList.add("原 " + i);
        }

        viewPagerHelper = findViewById(R.id.viewPagerHelper);
        viewPager = findViewById(R.id.viewPager);
        ViewPagerScroller scroller = new ViewPagerScroller(this);
        // 时间越长，速度越慢。
        scroller.setScrollDuration(600);
        scroller.initViewPagerScroll(viewPager);

        adapter = new BannerAdapter(this, dataList);
        zoomOutTransformer = new ZoomOutTransformer();
        viewPager.setPageTransformer(true, zoomOutTransformer);
        viewPager.setOffscreenPageLimit(2);
        viewPager.setAdapter(adapter);
        viewPager.setCurrentItem(adapt