Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题

近期需求是TabLayout关联ViewPager滑动,类似于新闻类app。调用官方给出的关联方法 setupWithViewPager(ViewPager) 出来的效果是这样的:


Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题
文章图片



关联后不显示的问题主要原因是 setupWithViewPager() 这个方法,这个方法会移除所有的Tab,源码如下:


Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题
文章图片



如图第一处红框移除了所有的Tab,然后在第二处重新设置Tab,并且调用ViewPager适配器Adapter的getPageTitle()方法,我们进入getPageTitle()方法,如图:


Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题
文章图片


看完源码我们应该就知道了问题所在,该方法一直返回的是null,所以我们第一种方法则是重写getPageTitle():

mViewPager.setAdapter(new FragmentStatePagerAdapter(getSupportFragmentManager()) { @NonNull @Override public Fragment getItem(int position) { return mFragmentList.get(position); } @Override public int getCount() { return mFragmentList.size(); } @Nullable @Override public CharSequence getPageTitle(int position) { return mTitleList.get(position); } });

重写后返回对应的标题。这样就可以解决了;
第二种方法:
不用setupWithViewPager() 方法,增加TabLayout的监听,用户选中后切换ViewPager,代码如下:
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {@Overridepublic void onTabSelected(TabLayout.Tab tab) {vpViewPager.setCurrentItem(tab.getPosition()); }@Overridepublic void onTabUnselected(TabLayout.Tab tab) {}@Overridepublic void onTabReselected(TabLayout.Tab tab) {}});

注:这种方法还要给ViewPager设置监听,切换ViewPager时才能让TabLayout也跟着切换。
第三种方法:
【Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题】添加Tab后然后调用setupWithViewPager();这时候如果没有重写getPageTitle方法是没有标题的,我们可以再绑定后设置标题:


Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题
文章图片


效果图:
Android开发问题|TabLayout 和 ViewPager 关联后标题不显示问题
文章图片

    推荐阅读