上篇文章实现了不能左右滑动切换的底部导航栏,如何在导航页面的里再写一个可左右滑动切换页面的标签栏?
实现效果
页面可左右滑动切换
代码实现
创建viewpage.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">
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
创建fragment类,加载每页的页面,这里是homeFragment2
public class homeFragment2 extends Fragment {
String titleString;
List<String> infoDataList = new ArrayList<>();
public void setTitleString(String titleString) {
this.titleString = titleString;
}
public void setinfoDataList(List<String> textList) {
this.infoDataList = textList;
}
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
// 加载 Fragment 的布局文件
View view = inflater.inflate(R.layout.viewpage, container, false);
// 在这里添加代码,例如初始化视图、绑定数据等等
TextView textView = (TextView) view.findViewById(R.id.textView);
// 设置数据
textView.setText("123");//这里可以根据设置的titleString设置每个页面的显示文字不同
return view;
}
}
创建ViewPagers的适配器,这里是ViewPagerAdapter
public class ViewPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> fragmentList;
private String[] titles;
public ViewPagerAdapter(FragmentManager fragmentManager, List<Fragment> fragmentList, String[] titles) {
super(fragmentManager);
this.fragmentList = fragmentList;
this.titles = titles;
}
@Override
public Fragment getItem(int position) {
return fragmentList.get(position);
}
@Override
public int getCount() {
return fragmentList.size();
}
@Override
public CharSequence getPageTitle(int position) {
return titles[position];
}
}
页面的总布局,这里是fragment_home.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"
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.google.android.material.tabs.TabLayout
android:id="@+id/tab_layout"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:tabIndicatorFullWidth="false"
app:tabSelectedTextColor="#1296db"
app:tabIndicatorColor="#1296db"
app:tabIndicatorHeight="3dp"
app:tabMode="scrollable">
</com.google.android.material.tabs.TabLayout>
<androidx.viewpager.widget.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</androidx.viewpager.widget.ViewPager>
</LinearLayout>
在Activity或Fragment中使用,这里是homeFragment.java
public class homeFragment extends Fragment {
private TabLayout tabLayout;
private ViewPager viewPager;
List<Fragment> fragmentList = new ArrayList<>();//每个页面的列表
ViewPagerAdapter viewPagerAdapter;
String[] titles = {"111","222","333"};//设置导航栏各量级名称
homeFragment2 homeFragment2;//页面的布局对象
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View view = LayoutInflater.from(getActivity()).inflate(R.layout.fragment_home, container, false);
tabLayout = (TabLayout) view.findViewById(R.id.tab_layout);
viewPager = (ViewPager) view.findViewById(R.id.view_pager);
fragmentList.add(new homeFragment2());//添加页面,有多少页面添加多少个fragment对象
fragmentList.add(new homeFragment2());//添加页面
fragmentList.add(new homeFragment2());//添加页面
return view;
}
@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
viewPagerAdapter = new ViewPagerAdapter(getChildFragmentManager(), fragmentList, titles);
viewPager.setAdapter(viewPagerAdapter);
tabLayout.setupWithViewPager(viewPager);
}
}
完成。