Android ViewPager简单使用

1.ViewPager实现自动滚动效果

轮播图由背景图片、文字描述、导航点组成，图片在适配器里面更新，由于文字描述、导航点是配合ViewPager显示，在滚动到当前item时更新，代码如下：

public class MainActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {

    private ViewPager viewPager;
    private int[] picres;//轮播的图片数组
    private ArrayList<ImageView> list;
    private LinearLayout ll_points;//跟随轮播图的导航点
    private String[] desc;///跟随轮播图的文字描述
    private TextView tv_desc;
    private boolean isRunning = true;//是否在轮播显示
    private  ImageView imageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();//初始化View
        initData();//数据初始化
        initAdapter();//初始化适配器
        //轮询（自动轮番）
        new Thread(new Runnable() {
            @Override
            public void run() {
               while (isRunning){
                   try {
                       Thread.sleep(2000);//两秒轮播一次
                   } catch (InterruptedException e) {
                       e.printStackTrace();
                   }
                   runOnUiThread(new Runnable() {
                       @Override
                       public void run() {
                           //设置显示的当前item（每隔2秒自动轮播到下一个）
                           viewPager.setCurrentItem(viewPager.getCurrentItem() + 1);
                       }
                   });
               }
            }
        }).start();
    }

    private void initAdapter() {
        viewPager.setAdapter(new MyAdapter());
        viewPager.setCurrentItem(5000000);//初始当前位置（为了可以左右都可以无限滑动）
    }

    private void initData() {
        for (int i= 0;i < picres.length;i++){
            imageView = new ImageView(this);
            imageView.setBackgroundResource(picres[i]);
            list.add(imageView);
            View view = new View(this);
            view.setBackgroundResource(R.drawable.select_point);
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(10, 10);
            ll_points.addView(view,layoutParams);
            if (i!=0) {
                layoutParams.leftMargin = 10;//设置间隙
            }
        }
    }

    private void initView() {
        viewPager = findViewById(R.id.vp);
        viewPager.setOffscreenPageLimit(2);//左右缓存数量
        viewPager.addOnPageChangeListener(this);//监听ViewPager
        ll_points = findViewById(R.id.ll_points);
        tv_desc = findViewById(R.id.tv_desc);//文字描述
        picres = new int[]{R.mipmap.a,R.mipmap.b,R.mipmap.c,R.mipmap.d,R.mipmap.e};     
        desc = new String[]{"读书无疑须有疑","有疑定要求无疑","无疑本自有疑始","有疑方能达无疑","将信将疑"};
        list = new ArrayList<>();
    }
    
     //滚动时调用
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
    }

    //滚动到当前item调用
    @Override
    public void onPageSelected(final int position) {
        tv_desc.setText(desc[position%5]);//文字描述设置
        for (int i=0;i<ll_points.getChildCount();i++){
            ll_points.getChildAt(i).setEnabled(position%5 == i);//对滚到的item设置不同背景
        }
    }

    /*此方法是在状态改变的时候调用，其中state这个参数
     *有三种状态（0，1，2）
     *state=0的时辰默示什么都没做
     *state ==1的时辰默示正在滑动
     *state==2的时辰默示滑动完毕了
     */
    @Override
    public void onPageScrollStateChanged(int state) {

    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        isRunning = false;//结束轮播
    }
}

2.PagerAdapter适配器

    public class MyAdapter extends PagerAdapter {

        @Override
        public int getCount() {
            return Integer.MAX_VALUE;//轮播位置的数量，模拟可以无限滑动
        }
        /**
         * 创建要显示的当前条目内容
         * @param container:ViewPager
         * @param position:当前条目位置
         * @return:显示的当前条目内容
         */
        @NonNull
        @Override
        public Object instantiateItem(@NonNull ViewGroup container, final int position) {
            ImageView imageView = list.get(position%5);//拿到当前对象
            //当前图片点击事件
            imageView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(MainActivity.this, desc[position%5], Toast.LENGTH_SHORT).show();
                }
            });
            //将当前对象加到容器
            container.addView(imageView);
            return imageView;
        }


        @Override
        public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
            container.removeView((ImageView)object);
        }

        //判断view是否有缓存复用
        @Override
        public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
            return view == object;
        }
    }

3.导航点的设置

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:drawable="@drawable/shape_point"/>
    <item android:state_enabled="false" android:drawable="@drawable/shape_point_dark"/>
</selector>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="20dp"/>
    <solid android:color="#fff" />
</shape>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <corners android:radius="20dp"/>
    <solid android:color="@android:color/darker_gray" />
</shape>

4.布局

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    tools:context=".MainActivity">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <androidx.viewpager.widget.ViewPager
            android:id="@+id/vp"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="45dp"
            android:background="#80000000"
            android:padding="5dp"
            android:orientation="vertical"
            android:layout_alignParentBottom="true">

            <TextView
                android:id="@+id/tv_desc"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:maxLines="1"
                android:layout_gravity="center_horizontal"
                android:ellipsize="end"
                android:textColor="@android:color/white"/>

            <LinearLayout
                android:id="@+id/ll_points"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:layout_gravity="center"
                android:layout_marginTop="5dp">
            </LinearLayout>
        </LinearLayout>
    </RelativeLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

待完善