技术点总结:
首先在需要在build.gradle中添加
//TabLayout
implementation "com.google.android.material:material:1.1.0"
//viewpager2
implementation 'androidx.viewpager2:viewpager2:1.0.0'
然后在界面布局中添加谷歌的TabLayout以及ViewPager2
<!--app:tabGravity="fill" 填充整个 app:tabIndicatorColor="@color/colorPrimaryDark" 下标指示器显示颜色 app:tabMode="fixed" 悬浮在上面
app:tabSelectedTextColor="@color/colorPrimaryDark" 设置选中时字体的颜色 app:tabTextColor="@color/colorAccent" 设置文本颜色-->
<!--需要在gradle中添加 implementation "com.google.android.material:material:1.1.0" -->
<com.google.android.material.tabs.TabLayout
android:id="@+id/tl_order_title"
android:layout_width="match_parent"
android:layout_height="50dp"
app:tabGravity="fill"
app:tabIndicatorColor="@color/colorPrimaryDark"
app:tabMode="fixed"
app:tabSelectedTextColor="@color/colorPrimaryDark"
app:tabTextColor="@color/colorAccent"/>
<!-- android:orientation="horizontal" 设置滚动方式 为横向滚动-->
<!--需要在gradle中添加 implementation 'androidx.viewpager2:viewpager2:1.0.0'-->
<androidx.viewpager2.widget.ViewPager2
android:id="@+id/vp_order_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"/>
然后去ui文件中设置该界面布局以及导航栏的标签
private String[] title={"全部", "待支付", "已支付", "已入住", "已取消","NoShow"};
private int[] orderStateIdTitle = {0, 1, 2, 3, 5, 6};//数据库对应这里主要是将TabLayout+ViewPager2建立关联
//TabLayout 顶部分类标题
TabLayout tlOrderList = view.findViewById(R.id.tl_order_title);
//ViewPager2 OrderFragment的容器
ViewPager2 vpOrderContainer = view.findViewById(R.id.vp_order_container);
//===自定义myActionBar
MyActionBar myActionBar = view.findViewById(R.id.myActionBar);
myActionBar.setData("订单", 0, 0, null);
//实例化适配器
MyFragmentStateAdapter myAdapter=new MyFragmentStateAdapter(getActivity());
//给ViewPager2设置适配器
vpOrderContainer.setAdapter(myAdapter);
//ViewPager2设置预加载 传入大于1的值来设置预加载数量,默认不预加载
vpOrderContainer.setOffscreenPageLimit(1);
//TabLayout+ViewPager2建立关联
new TabLayoutMediator(tlOrderList, vpOrderContainer, new TabLayoutMediator.TabConfigurationStrategy() {
@Override
public void onConfigureTab(@NonNull TabLayout.Tab tab, int position) {
// tab:当前处于选中状态的Tab对象
// position:当前Tab所处的位置
tab.setText(title[position]);
}
}).attach();// 不要忘记attach(),否则没效果
在这里MyFragmentStateAdapter类中继承FragmentStateAdapter以便让
ViewPager2+FragmentStateAdapter建立关联,定义一个构造器存放Fragment数组对象,重写两个父类方法达到切换到对应position索引界面的效果,然后在这个类里面定义一个Fragment数组以便从另外一个OderListFragment界面,返回对应显示的内容
//自定义适配器 ViewPager2的适配器继承FragmentStateAdapter
class MyFragmentStateAdapter extends FragmentStateAdapter{
//存放Fragment
private Fragment[] fragments;
//构造器
public MyFragmentStateAdapter(@NonNull FragmentActivity fragmentActivity) {
super(fragmentActivity);
fragments=new Fragment[title.length];
}
@NonNull
@Override
public Fragment createFragment(int position) {
//Fragment懒加载
if (fragments[position]==null){
//传递参数到OderListFragment
Bundle bundle=new Bundle();//相当于多个键值对集合
bundle.putInt("orderStateId",orderStateIdTitle[position]);
OderListFragment oderListFragment=new OderListFragment();
oderListFragment.setArguments(bundle);
fragments[position]=oderListFragment;
}
//返回需要显示的Fragment
return fragments[position];
}
//返回有多少个页面
@Override
public int getItemCount() {
return fragments.length;
}
}
效果: