AppBar下方TabLayout按钮不显示问题求助（用23.0.1版本支持库）

我之前在使用23.0.1版本的design库时，也碰到过TabLayout明明滑动功能正常，但按钮完全看不见的坑，结合你的情况，咱们一步步来排查修复：

1. 先检查ViewPager和TabLayout的关联逻辑 #

这个版本的setupWithViewPager()有个小坑：必须先给ViewPager设置好PagerAdapter，再调用关联方法，而且Adapter一定要重写getPageTitle()方法返回Tab标题，否则Tab会是空的。

举个正确的代码示例：

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // 先找到ViewPager并设置Adapter
    ViewPager viewPager = findViewById(R.id.view_pager);
    viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));

    // 再关联TabLayout和ViewPager
    TabLayout tabLayout = findViewById(R.id.tab_layout);
    tabLayout.setupWithViewPager(viewPager);
}

// 别忘了让PagerAdapter重写getPageTitle方法
private class MyPagerAdapter extends FragmentPagerAdapter {
    private final String[] tabTitles = {"Tab1", "Tab2", "Tab3"};

    public MyPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        // 返回对应位置的Fragment
        return new YourFragment();
    }

    @Override
    public int getCount() {
        return tabTitles.length;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        // 这里必须返回Tab的标题文字，不然Tab会显示为空
        return tabTitles[position];
    }
}

2. 检查布局文件里的TabLayout属性 #

很多时候是布局设置出问题导致Tab被隐藏了：

• 确保TabLayout的高度是wrap_content，如果设成0dp或者match_parent，可能会被挤压或超出屏幕；
• 确认TabLayout是放在AppBarLayout内部的Toolbar下方，没有被Toolbar遮挡；

给你一个标准的布局示例参考：

<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" <!-- 这里一定要用wrap_content -->
            app:tabMode="fixed"
            app:tabGravity="fill" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>

3. 如果不用ViewPager，要手动添加Tab项 #

要是你没和ViewPager绑定，而是自己管理Tab切换，一定要记得调用addTab()方法手动添加Tab：

TabLayout tabLayout = findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Tab1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab2"));
tabLayout.addTab(tabLayout.newTab().setText("Tab3"));

4. 排查文字颜色和背景色冲突 #

有时候Tab文字颜色和背景色太接近，看起来像是没显示，你可以显式设置Tab的文字颜色：

<android.support.design.widget.TabLayout
    ...
    app:tabTextColor="@color/your_unselected_color"
    app:tabSelectedTextColor="@color/your_selected_color"
    app:tabIndicatorColor="@color/your_indicator_color" />

5. 考虑版本bug的问题 #

23.0.1的design库确实存在一些小bug，如果上面的方法都试过还是不行，可以试试升级到同系列的稳定版本（比如23.4.0），或者检查有没有其他布局控件和TabLayout发生了冲突。

内容的提问来源于stack exchange，提问作者Fatima