TabLayout 和 ViewPager 关联后标题不显示问题

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





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





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




看完源码我们应该就知道了问题所在，该方法一直返回的是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() {

        @Override

        public void onTabSelected(TabLayout.Tab tab) {

            vpViewPager.setCurrentItem(tab.getPosition());

        }

        @Override

        public void onTabUnselected(TabLayout.Tab tab) {

        }

        @Override

        public void onTabReselected(TabLayout.Tab tab) {

        }

    });

注：这种方法还要给ViewPager设置监听，切换ViewPager时才能让TabLayout也跟着切换。

第三种方法：

添加Tab后然后调用setupWithViewPager()；这时候如果没有重写getPageTitle方法是没有标题的，我们可以再绑定后设置标题：




效果图：