TabLayout使用介绍

所在包：android.support.design.widget
继承类：android.widget.HorizontalScrollView
背景：北京时间2015.5.29谷歌I/O开发者大会，带来了更加详细的Material Design设计规范，同时，也给我们带来了全新的Android Design Support Library，在这个support库里面，Google给我们提供了更加规范的MD设计风格的控件。最重要的是，Android Design Support Library的兼容性更广，直接可以向下兼容到Android 2.2。这不得不说是一个良心之作。
Android源码中TabLayout类说明：TabLayout提供了显示选项卡的水平布局。

build.gradle中添加依赖配置

dependencies {
    implementation 'com.android.support:design:28.0.0'
}

1.创建Tab
Tab的显示是通过TabLayout.Tab类来完成的，创建Tab的方法是TabLayout里的newTab();

2.添加Tab
将Tab添加到TabLayout布局的方法：
方法一：在Java类中调用TabLayout的addTab方法

 TabLayout tabLayout = ...;
 tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
 tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
 tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));

方法二：在布局xml中在TabLayout中添加TabItem

 <android.support.design.widget.TabLayout
         android:layout_height="wrap_content"
         android:layout_width="match_parent">

     <android.support.design.widget.TabItem
             android:text="@string/tab_text"/>

     <android.support.design.widget.TabItem
             android:icon="@drawable/ic_android"/>

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

3.设置Tab选项卡的选择状态发生更改时的监听类

 addOnTabSelectedListener(TabLayout.BaseOnTabSelectedListener listener)

4.默认选中某项
tablayout.getTabAt(position).select();

5.Tab添加图标

tabLayout.addTab(tabLayout.newTab().setText("Tab 1").setIcon(R.mipmap.ic_launcher));

效果图

6.页面使用TabLayout+ViewPager配合
只需要两步即可
(1) 调用setupWithViewPager(ViewPager)方法传入
(2) 重写PagerAdapter的getPageTitle方法，返回对应值就是对应position上Tab的文本内容。

如果将android.support.v4.view.ViewPager与此布局一起使用，则可以调用setupWithViewPager(ViewPager)将二者链接在一起。这个布局将调用PagerAdapter的getPageTitle方法来自动填充。当点击Tab时也会自动调用addOnTabSelectedListener方法监听Tab选择，当选择时会调用ViewPager的setCurrentItem方法来切换Tab页。

使用TabLayout+ViewPager简单示例：

@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        private TabLayout mLlistTl = findViewById(R.id.tl_processlist);
        mLlistTl.setupWithViewPager(mProcessVp);
    }

    class PageAdapter extends FragmentPagerAdapter {
        public static final String[] TITLE_LIST = {"我发起", "待处理", "已处理", "抄送我的"};
        private Map<Integer, BaseProcessListFragment> fragmentMap;

        PageAdapter(FragmentManager fm) {
            super(fm);
            fragmentMap = new HashMap<>();
        }
        
        @Override
        public int getCount() {
            return TITLE_LIST == null ? 0 : TITLE_LIST.length;
        }

        @Nullable
        @Override
        public CharSequence getPageTitle(int position) {
            return (TITLE_LIST == null || position >= TITLE_LIST.length) ? "" : TITLE_LIST[position];
        }

        @Override
        public Fragment getItem(int position) {
            if (fragmentMap.containsKey(position)) {
                return fragmentMap.get(position);
            }
            BaseProcessListFragment fragment = BaseProcessListFragment.newInstance(position + 1);
            fragmentMap.put(position, fragment);
            return fragment;
        }
    }
    

这个TabLayout还支持作为ViewPager装饰的一部分使用，并且可以在xml布局资源文件中直接添加到ViewPager，如下所示:

<android.support.v4.view.ViewPager
     android:layout_width="match_parent"
     android:layout_height="match_parent">

     <android.support.design.widget.TabLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_gravity="top" />

 </android.support.v4.view.ViewPager>

xml属性含义

app:tabBackground	设置背景色。和android:background效果一样。
app:tabGravity	 内容显示模式，有两个可选值。center(内容中心显示) fill充满(内容尽可能充满TabLayout)
app:tabIndicatorColor	 设置指示器的颜色
app:tabIndicatorHeight	 设置指示器的高度(0dp则为不显示指示器)
app:tabMode	 Tab模式，有两个可选值。默认fixed(固定的tab，Tab多时会被挤压，不能滑动)，scrollable(可滑动tab)
app:tabSelectedTextColor	设置选中Tab的文字颜色 
app:tabTextAppearance	 设置tab文字的TextAppearance样式的引用（大小，字体等）
app:tabTextColor  设置未选中Tab的文字颜色
app:tabContentStart	 相对起始位置tab的Y轴偏移量
app:tabMaxWidth	 设置最大的tab宽度
app:tabMinWidth	设置最小的tab宽度
app:tabPadding	 设置tab的内边距（上下左右）
app:tabPaddingBottom	 设置tab的底部内边距
app:tabPaddingEnd	 设置tab的右侧内边距
app:tabPaddingStart	 设置tab的左侧内边距
app:tabPaddingTop	 设置tab的上方内边距