android ViewPager2的使用教程

时间：2025-04-08 16:12:23

谷歌发布了Android的ViewPager2测试版，让我们看看它有什么不同。

Android ViewPager2

首先使用ViewPager2,先在添加依赖

implementation 'androidx.viewpager2:viewpager2:1.0.0-alpha01'
复制代码

Android ViewPager2的特性

  • 从右到左的布局支持
  • 垂直方向
  • 取代PagerAdapter
  • registerOnPageChangeCallback 取代 addPageChangeListener
  • 更高效的notifyDataSetChanged

ViewPaver2与ViewPager的区别

同样在xml中使用一样。

 <androidx..ViewPager2
       android:id="@+id/viewpager2"
       android:layout_width="match_parent"
       android:layout_height="match_parent"/>
复制代码

在以前的ViewPager的addOnPageChangeListener方法，我们需要覆盖三个方法。回顾下代码如下

 (new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                
            }

            @Override
            public void onPageSelected(int position) {

            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
复制代码

在ViewPager2中，不再需要这样的重写。

 (new ViewPager2.OnPageChangeCallback() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                (position, positionOffset, positionOffsetPixels);
            }
        });
复制代码

垂直方向属性

默认是水平方向ORIENTATION_HORIZONTAL,垂直是ORIENTATION_VERTICAL

(ViewPager2.ORIENTATION_VERTICAL);
复制代码

ViewPager2与RecycleView的结合使用

接下来，我们使用来结合ViewPager2一起使用。不再需要像ViewPager使用FragmentStateAdapter。

项目结构如下:

activity_main.xml代码

<?xml version="1.0" encoding="utf-8"?>
< xmlns:android="/apk/res/android"
    xmlns:app="/apk/res-auto"
    xmlns:tools="/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

   <androidx..ViewPager2
       android:id="@+id/viewpager2"
       android:layout_width="match_parent"
       android:layout_height="match_parent"/>


</>
复制代码

MainActivity的代码

public class MainActivity extends AppCompatActivity {
    ViewPager2 mviewPager2;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        (savedInstanceState);
        setContentView(.activity_main);
        mviewPager2 = findViewById(.viewpager2);
        List<String> list = new ArrayList<>();
        ("页面一");
        ("页面二");
        ("页面三");
        ("页面四");

        (new ViewPagerAdapter(this, list, mviewPager2));

    }
}
复制代码

列表Item的布局recycleview_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="/apk/res/android"
    xmlns:tools="/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <
        android:id="@+id/tvTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:textColor="@android:color/white"
        android:textSize="32sp"
        tools:text="item" />
</RelativeLayout>

复制代码

ViewPagerAdapter的代码如下，使用跟RecycleView的adapter完全一样

package .androidviewpager2;

import ;
import ;
import ;
import ;
import ;
import ;
import ;

import ;

import ;
import ;
import androidx..ViewPager2;

/**
 * @Author: wuchaowen
 * @Description:
 * @Time:
 **/
public class ViewPagerAdapter extends <> {
    private List<String> mData;
    private LayoutInflater mInflater;
    private ViewPager2 viewPager2;


    private int[] colorArray = new int[]{, .holo_blue_dark, .holo_green_dark, .holo_red_dark};


    public ViewPagerAdapter(Context context, List<String> data, ViewPager2 viewPager2) {
         = (context);
         = data;
        this.viewPager2 = viewPager2;
    }

    @NonNull
    @Override
    public  onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = (.recycleview_item, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(@NonNull  holder, int position) {
        String animal = (position);
        (animal);
        (colorArray[position]);

    }

    @Override
    public int getItemCount() {
        return ();
    }

    public class ViewHolder extends  {
        TextView myTextView;
        RelativeLayout relativeLayout;

        ViewHolder(View itemView) {
            super(itemView);
            myTextView = ();
            relativeLayout = ();

        }
    }
}

复制代码

运行效果

踩坑1 Androidx和Android support库不能共存

Manifest merger failed : Attribute application@appComponentFactory value=(.) from [:support-compat:28.0.0] :22:18-91
	is also present at [:core:1.1.0-alpha04] :22:18-86 value=().
	Suggestion: add 'tools:replace="android:appComponentFactory"' to <application> element at :6:5-22:19 to override.
复制代码

解决方案

  • 将build tools更新到3.2.0，gradle更新到4.6，依赖库统一更新到28.0.0，这一步非常重要，否则会导致第二步不能完全转换成功

  • 选择工程右键→Refactor→Migrate to Androidx

  • 选中所有需要重命名的目录，执行Do Refactor

  • 发现已经看不到support库了，运行成功安装app。

项目代码下载

相关文章