学不动也要学！|学不动也要学！ ViewPager2新特性学不动也要学！ViewPager2新特性

前言前两天浏览Android开发者官网的时候，发现Google竟然曾经悄悄推出过一个新的控件:ViewPager2,纳尼？？？这一看名字就知道是ViewPager的升级版本，看了下推出这个控件的时间，早在2019年2月7号Google就已经发布了，之后再进行一波迭代更新，在2019年11月20号进行了正式的发布；可以关联下Google曾经在2018年推出的Jetpack，旨在帮助开发者轻松构建更稳定健壮及可维护的Android开发生态解决方案，就可想而知此次推出ViewPager2，算是Google往被寄予厚望的Jetpack全家桶中又增添一员猛将；
既然是升级版，相比ViewPager，它究竟有哪些新功能和特性呢？
让我们接着往下看。
android ViewPager2新特性

基于RecyclewView实现。这意味着ViewPager2将继承RecyclewView的优点，同样完全支持RecyclerView的相关配置功能
支持垂直方向滑动。只需要一个参数就可以改变滑动方向；
支持关闭用户输入和模拟用户滑动。通过设置setUserInputEnabled()来设置是否禁用用户滑动行为；通过fakeDragBy(float offsetPx)模拟用户滑动页面；
支持多个PageTransformer
支持DiffUtil,通过添加数据集合实现局部数据刷新和Item动画。
支持RTL布局

和ViewPager进行对比
ViewPager2相比ViewPager做了哪些改变呢，下面对不同点进行了罗列:

采用registerOnPageChangeCallback() 代替addPageChangeListener()监听页面的变化
因为ViewPager2.java这个类被申明为fianl,无法继承它进行二次改造，不过可以copy一份进行修改加工
采用FragmentStateAdapter 替代FragmentStatePagerAdapter，采用 RecyclerView.Adapter 替代PagerAdapter;
offScreenPageLimit新参数新体验

Android ViewPager2的使用
ViewPager2 位于 androidx 包下，也就是它不像 ViewPager 一样被内置在系统源码中。因此，使用 ViewPager2 需要额外的添加依赖库。
另外，android support 中不包含 ViewPager2，也就是要使用 ViewPager2 必须迁移到 androidx 才可以。
① 添加依赖目前ViewPager2的最新稳定版本是1.0.0。

dependencies { implementation "androidx.viewpager2:viewpager2:1.0.0" }

② 在XML文件中申明

③自定义Adapter ViewPager2 是用 RecyclerView来实现的，因此它的 Adapter 其实就是 RecyclerView 的 Adapter。

class MyAdapter extends RecyclerView.Adapter { private List mList; public PagerViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) { View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_page, parent, false); return new PagerViewHolder(view); }@Override public void onBindViewHolder(@NonNull PagerViewHolder holder, int position) { holder.bindData(position); }@Override public int getItemCount() { return mList.size(); }public void setList(List list){ this.mList = list; }class PagerViewHolder extends RecyclerView.ViewHolder { private TextView mTextView = itemView.findViewById(R.id.tv_text); private String[] colors = new String[]{"#CCFF99", "#41F1E5", "#8D41F1", "#FF99CC"}; public PagerViewHolder(@NonNull View itemView) { super(itemView); }private void bindData(int index) { mTextView.setText(index); mTextView.setBackgroundColor(Color.parseColor(colors[index])); } } }

item_page布局文件:

④ 绑定ViewPager和Adpater

ViewPager2 viewPager2 = findViewById(R.id.view_pager); MyAdapter myAdapter = new MyAdapter(); myAdapter.setList(data) viewPager2.setAdapter(myAdapter);

通过上述接入，就可以完成一个ViewPager滑动页简单的效果，如下；

文章图片

⑤ 设置竖向滑动只需要一行代码就能设置ViewPager2进行竖向方向的滑动:

viewPager2.setOrientation(ViewPager2.ORIENTATION_VERTICAL);

而这一点，如果是换做之前的ViewPager是比较难达到的效果,可以来看下效果:

文章图片

⑥ 页面滑动监听事件上面说到viewPager2监听页面滑动只需要重写我们需要的方法即可

viewPager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() { @Override public void onPageSelected(int position) { super.onPageSelected(position); } });

⑦ 禁止用户滑动和模拟用户滑动涉及 API：setUserInputEnabled() 与 fakeDragBy()。
我们知道，在使用 ViewPager 的时候想要禁止用户滑动需要重写 ViewPager 的 onInterceptTouchEvent()。而 ViewPager2 被声明为了 final，我们无法再去继承 ViewPager2。
那么我们应该怎么禁止 ViewPager2 的滑动呢？其实在 ViewPager2 中已经为我们提供了这个功能，只需要通过 setUserInputEnabled() 即可实现。

viewPager2.setUserInputEnabled(false);

同时 ViewPager2 新增了一个 fakeDragBy() 的方法。通过这个方法可以来模拟拖拽。在使用 fakeDragBy() 前需要先 beginFakeDrag() 方法来开启模拟拖拽。
fakeDragBy() 会返回一个 boolean 值：
true 表示有 fake drag 正在执行；
false 表示当前没有 fake drag 在执行。
我们通过代码来尝试下：

private void fakeDragBy(ViewPager2 viewPager2) { viewPager2.beginFakeDrag(); if (viewPager2.fakeDragBy(100f)) { viewPager2.endFakeDrag(); } }

需要注意到是 fakeDragBy() 接受一个 float 的参数，当参数值为正数时表示向前一个页面滑动，当值为负数时表示向下一个页面滑动。
下面来看下效果图：

文章图片

演示图中禁止了用户输入，通过按钮点击可以模拟用户滑动。
⑧ offScreenPageLimit() 在viewpager中也可以设置预加载页面参数，但是就算我们去设置了0，ViewPager的内部还是会强制改成，这也是被广大开发者诟病的地方；
而在ViewPager2中对这点进行了优化，可以通过源码发现：

# VewPager2private @OffscreenPageLimit int mOffscreenPageLimit = OFFSCREEN_PAGE_LIMIT_DEFAULT; /** * Value to indicate that the default caching mechanism of RecyclerView should be used instead * of explicitly prefetch and retain pages to either side of the current page. * @see #setOffscreenPageLimit(int) */ public static final int OFFSCREEN_PAGE_LIMIT_DEFAULT = -1; /** @hide */ @SuppressWarnings("WeakerAccess") @RestrictTo(LIBRARY_GROUP_PREFIX) @Retention(SOURCE) @IntDef({OFFSCREEN_PAGE_LIMIT_DEFAULT}) @IntRange(from = 1) public @interface OffscreenPageLimit { }

可以看到，将默认预加载页面数量设置为默认值-1，这里可以理解为不进行页面预加载操作；而且如果要设置预加载页面数量，可以通过设置setOffscreenPageLimit值来进行赋值，注意这里将其注解标注为大于等于1；

public void setOffscreenPageLimit(@OffscreenPageLimit int limit) { if (limit < 1 && limit != OFFSCREEN_PAGE_LIMIT_DEFAULT) { throw new IllegalArgumentException( "Offscreen page limit must be OFFSCREEN_PAGE_LIMIT_DEFAULT or a number > 0"); } mOffscreenPageLimit = limit; // Trigger layout so prefetch happens through getExtraLayoutSize() mRecyclerView.requestLayout(); }

下面就让我们看下设置不同的mOffscreenPageLimit数量会有啥不同的效果:
首先我们在 ViewPager 中添加多个 Fragment，并且 setOffscreenPageLimit() 使用默认值，然后再 Fragment 声明周期中打印出日志，代码不再贴出，直接看日志打印的内容：

文章图片

可以看到只有第一个fragment初始化了，那么当我们滑动到下个fragment，看下日志:

文章图片

看到只有当滑动到第二个fragment时候，页面才开始加载；因此当采用默认值-1时，滑动过程中不会发生预加载
接下来我们将 offscreenPageLimit 值改为 1，再来看下输出日志：

文章图片

此时可以看到 offscreenPageLimit 设置为 1 后，会预加载进来一个页面，和 ViewPager 几乎是一样的效果。
总之，ViewPager2 对于 ViewPager 的预加载机制做了优化，使得体验上变得更好。
看到这里，很多人都会觉得，就这就这？ViewPager2难道只多了这么点功能？别急，下面这个新动效才是亮点；
三 PageTransformer
ViewPager2 的 Transformer 功能相比于 ViewPager 有了很大的扩展。
ViewPager2 不仅可以通过 PageTransformer 用来设置页面动画，还可以同时添加多个 PageTransformer。接下来我们就来看看 ViewPager2 的 PageTransformer 吧！
首先介绍一下 CompositePageTransformer 从名字上可以看出，它是一个组合了的PageTransformer，其实CompositePageTransformer实现了 PageTransformer 的接口，内部维护了一个 PageTransformer的List集合；
那么看看如何使用这个CompositePageTransformer

CompositePageTransformer compositePageTransformer = new CompositePageTransformer(); compositePageTransformer.addTransformer(new ScaleInTransformer()); compositePageTransformer.addTransformer(new MarginPageTransformer(10)); viewPager2.setPageTransformer(compositePageTransformer);

上面代码中，我们给CompositePageTransformer设置了一个自定义页面缩放的ScaleInTransformer和一个页边距的MarginPageTransformer，可以看下效果：

文章图片

自定义页面缩放的ScaleInTransformer代码如下:

class ScaleInTransformer implements ViewPager2.PageTransformer { static final float DEFAULT_MIN_SCALE = 0.85f; static final float DEFAULT_CENTER = 0.5f; @Override public void transformPage(@NonNull View view, float position) { view.setElevation(-abs(position)); int pageWidth = view.getWidth(); int pageHeight = view.getHeight(); view.setPivotY((pageHeight / 2)); view.setPivotX((pageWidth / 2)); if (position < -1) { view.setScaleX(DEFAULT_MIN_SCALE); view.setScaleY(DEFAULT_MIN_SCALE); view.setPivotX(pageWidth); } else if (position <= 1) { if (position < 0) { float scaleFactor = (1 + position) * (1 - DEFAULT_MIN_SCALE) + DEFAULT_MIN_SCALE; view.setScaleX(scaleFactor); view.setScaleY(scaleFactor); view.setPivotX(pageWidth * (DEFAULT_CENTER + DEFAULT_CENTER * -position)); } else { float scaleFactor = (1 - position) * (1 - DEFAULT_MIN_SCALE) + DEFAULT_MIN_SCALE; view.setScaleX(scaleFactor); view.setScaleY(scaleFactor); view.setPivotX(pageWidth * ((1 - position) * DEFAULT_CENTER)); } } else { view.setPivotX(0f); view.setScaleX(DEFAULT_MIN_SCALE); view.setScaleY(DEFAULT_MIN_SCALE); } } }

viewpager2一屏多页的实现查看google官方文档，可以看到官方实现一屏多页给出的代码是通过给recyclerview设置padding来实现的，代码如下:

RecyclerView recyclerView = (RecyclerView) viewPager2.getChildAt(0); int padding = 20; recyclerView.setPadding(padding, 0, padding, 0); recyclerView.setClipToPadding(false); CompositePageTransformer compositePageTransformer = new CompositePageTransformer(); compositePageTransformer.addTransformer(new ScaleInTransformer()); compositePageTransformer.addTransformer(new MarginPageTransformer(10)); viewPager2.setPageTransformer(compositePageTransformer);

最后来看下效果：

四、Fragment中如何使用ViewPager2
上文讲述到在 ViewPager2 中采用 FragmentStateAdapter 代替了原先的 FragmentStatePagerAdapter，那么接下来看下如何搭配Fragment去使用ViewPager2
4.1 xml布局文件中添加ViewPager2

4.2 实现 FragmentStateAdapter 要使用FragmentStateAdapter最好的方式就是去自定义一个自己的Adapter，让我们来看下代码:

class CustomAdapterFragmentPager extends FragmentStateAdapter {final int PAGE_HOME = 0; final int PAGE_FIND = 1; final int PAGE_INDICATOR = 2; final int PAGE_OTHERS = 3; public CustomAdapterFragmentPager(@NonNull FragmentActivity fragmentActivity) { super(fragmentActivity); }@NonNull @Override public Fragment createFragment(int position) { switch (position) { case PAGE_HOME: return HomeFragment.getInstance(); case PAGE_FIND: return PageFragment.getInstance(); case PAGE_INDICATOR: return IndicatorFragment.getInstance(); case PAGE_OTHERS: return OthersFragment.getInstance(); default: return EmptyFragment.getInstance(); } }@Override public int getItemCount() { return 4; } }

上述代码覆写了createFragment和getItemCount方法，可以看到其实和FragmentStatePagerAdapter做的事情差不多；
4.3 ViewPager2设置FragmentStateAdapter 初始化完ViewPager2和FragmentStateAdapter之后，最后一步就是给ViewPager设置上adapter，代码如下:

viewPager2.setAdapter(new CustomAdapterFragmentPager(this)); viewPager2.setOffscreenPageLimit(3); viewPager2.setUserInputEnabled(false);

五、TabLayout和ViewPager2
TabLayout在平时开发工作中出现的频率也不算低了，经常会用来和ViewPager一起搭配使用，那么在TabLayout中如何搭配使用ViewPager2呢?
和原有的ViewPager不同，不能直接通过setViewPager来进行vp的设置；在ViewPager2中需要用到一个控件 TabLayoutMediator，这个类是在 material-1.2.0 中新增的一个类，目前 material 包的最新版本是 1.2.0-alpha03，添加依赖如下:

implementation 'com.google.android.material:material:1.2.0-alpha03'

需要传入三个参数去构造 TabLayoutMediator,第一个参数为 TabLayout；第二个参数为 ViewPager2；第三个参数是 TabConfigurationStrategy，这是一个接口，里面需要实现一个方法, onConfigureTab(@NonNull TabLayout.Tab tab, int position),第一个参数是当前的tablayout，第二个是当前的位置:

public interface TabConfigurationStrategy { /** * Called to configure the tab for the page at the specified position. Typically calls {@link * TabLayout.Tab#setText(CharSequence)}, but any form of styling can be applied. * * @param tab The Tab which should be configured to represent the title of the item at the given *position in the data set. * @param position The position of the item within the adapter's data set. */ void onConfigureTab(@NonNull TabLayout.Tab tab, int position); }

通过构造TabLayoutMediator，我们就可以将tablayout和viewpager2搭配起来使用了：

new TabLayoutMediator(tabLayout, viewPager2, new TabLayoutMediator.TabConfigurationStrategy() { @Override public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) { tab.setText(titles[position]); } });

最后来看下效果图:

文章图片

六、总结
在上述文章带领大家了解了一下ViewPager2的新特性，以及和ViewPager在开发使用中的区别；
可以看到不管是从API、性能还是动效上，ViewPager2都是远远领先于ViewPager的，所以我认为未来有很大概率将会取代原来的ViewPager的；
看完这些，是时候将ViewPager2接入到你的项目里了！
参考文章:
https://www.jianshu.com/p/bd7...?
?? 谢谢支持
以上便是本次分享的全部内容，希望对你有所帮助^_^
喜欢的话别忘了分享、点赞、收藏三连哦~。
【学不动也要学！|学不动也要学！ ViewPager2新特性】欢迎关注公众号程序员巴士，一辆有趣、有范儿、有温度的程序员巴士，涉猎大厂面经、程序员生活、实战教程、技术前沿等内容，关注我，交个朋友。