viewpager2 是对RecyclerView 的封装(所以viewpager2 自带懒加载方案),相对于viewpager,在实际项目中,更推荐使用viewpager2 。
实现效果
目前来说跟viewpager一毛一样

(1)创建viewpager2
在activity_main.xml中,更改为LinearLayout布局,再创建viewpager2布局。
如果找不到viewpager2,则需要添加依赖:
(2)构建viewPage2专属adapter
viewPage的显示需要适配别的数据,相当于一个容器,在容器中显示什么数据需要用户在使用的时候去适配。
在下图中,先是通过find创建viewPage2对象,然后用.setAdapter设置适配器。
Adapter类实例化了一个对象,并把这个对象作为适配器设置的传入参数,如下图:
接下来就是要定义一个Adapter类,这个类专门用于适配viewPage2
这个Adapter类要继承于RecyclerView.Adapter,并实现其里面的全部方法:(alt+enter选择继承)
实现如下图的方法:
(3)定义要适配的界面
创建一个新的布局

如下图:
当前UI框架如下图:
其实现在ViewPager已经实现了左滑右滑,只是要对Adapter进行操作。
定义一个内部类去封装RecyclerView.ViewHolder返回的数据,这个内部类为ViewPagerViewHolder,将要替换RecyclerView.ViewHolder
传入泛型
按住ctrl点进Adapter看看,发现是拓展自ViewHolder的一个泛型,就是传入的参数要是ViewHolder的一个泛型。
正是上面创建的内部类ViewPagerViewHolder。更改为传入泛型后,报错了,更改掉即可。
至此,adpter雏形就完成了。
(4)解析界面
解析要适配的xml
再解析xml里面的具体内容,分别是Layout和Textview.
(5)绑定不同的页面数据实现左右切换
绑定内容
实现绑定
数据怎么变化,未来可以使用架构MVP,MVM,MVC,这些架构有专门传递数据的值。
具体细节在代码中体现
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//为名为viewPage2的布局实例化一个对象
ViewPager2 viewPager2 = findViewById(R.id.viewPage2);
//实例化一个Adapter对象
ViewPager2Adapter viewPager2Adapter = new ViewPager2Adapter();
//设置名为viewPage2的布局的Adapter
viewPager2.setAdapter(viewPager2Adapter);
}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.viewpager2.widget.ViewPager2
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/viewPage2"
android:background="#ffff00"/>
</LinearLayout>
item_pager.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/container">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tvTitle"
android:layout_centerInParent="true"
android:textColor="#ff4532"
android:textSize="40dp"
android:text="hello"/>
</RelativeLayout>
item_pager.xml
/*为什么ViewPagerAdapter继承的会是RecyclerView.Adapter呢?
因为点进类ViewPager2发现其实就是对RecyclerView的适配,有很多RecyclerView的影子*/
public class ViewPager2Adapter extends RecyclerView.Adapter <ViewPager2Adapter.ViewPagerViewHolder>{
private List<String> titles = new ArrayList<>();
private List<Integer> colors = new ArrayList<>();
//构造方法:适配页面的数据(在viewPage初始化的时候就要初始化ArrayList)
public ViewPager2Adapter(){
titles.add("chen");
titles.add("li");
titles.add("chen");
titles.add("mei");
titles.add("wo");
titles.add("shuai");
colors.add(R.color.white);
colors.add(R.color.teal_700);
colors.add(R.color.teal_200);
colors.add(R.color.purple_700);
colors.add(R.color.purple_500);
colors.add(R.color.purple_200);
}
@NonNull
@Override
//这个方法返回的是类 ViewPagerViewHolder 所对应的一个对象,必须是一个java代码
//怎样创建一个view呢:解析xml。
public ViewPagerViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
//解析xml 这个view来自哪里呢?用下面的解析器进行解析
return new ViewPagerViewHolder(LayoutInflater.from
(parent.getContext()).inflate(R.layout.item_pager,parent,false));
}
@Override
//绑定不同的页面数据,适配不同的内容,让item_pager.xml的数据动态变化 position可以标识item
public void onBindViewHolder(@NonNull ViewPagerViewHolder holder, int position) {
holder.mTv.setText(titles.get(position));
//R.color.white传送的是资源id,所以要用setBackgroundResource,而不是setBackgroundColor
holder.mContainer.setBackgroundResource(colors.get(position));
}
@Override
//滚动的页面数量
public int getItemCount() {
//多出实际值程序闪退
return 6;
}
//定义一个内部类去封装RecyclerView.ViewHolder返回的数据
class ViewPagerViewHolder extends RecyclerView.ViewHolder{
//这个ViewPagerViewHolder正是用于解析item_pager.xml的
TextView mTv;
RelativeLayout mContainer;
//实现构造函数
public ViewPagerViewHolder(@NonNull View itemView) {
super(itemView);
//解析id为container的item_pager.xml根布局:RelativeLayout
mContainer = itemView.findViewById(R.id.container);
//解析item_pager.xml下的TextView
mTv = itemView.findViewById(R.id.tvTitle);
}
}
}
