对于TabLayout独有的属性比较多，我也是查看了文档才一一弄清楚是怎么个情况，我这里主要做一个总结，和实现其功能，给大家使用时候一个参考，免得网上百度不到众多属性是什么意思，以及要实现某个功能需要哪些属性。
1.TabLayout与AppBarLayout的融合
一般使用TabLayout是将其写入AppBarLayout里面，与标题栏融为一体，这样可以让菜单标题一体化，界面看起来更和谐紧密。
<android.support.design.widget.AppBarLayout android:id="@+id/activity_main_appbar" 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/activity_main_toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_scrollFlags="scroll|enterAlways" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"> </android.support.v7.widget.Toolbar> <android.support.design.widget.TabLayout android:id="@+id/activity_main_tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabIndicatorColor="#AD9F79EE" app:tabSelectedTextColor="#FF00FF00" app:tabTextColor="#FF000000" app:tabMode="scrollable" app:tabGravity="center" app:tabContentStart="0dp" app:tabBackground="@android:color/white" app:tabIndicatorHeight="2dp" app:tabMaxWidth="100dp" app:tabMinWidth="50dp" /> </android.support.design.widget.AppBarLayout>
下面我们来看看这众多的属性是什么意思。
⒈app:tabIndicatorColor：其为文章开始图片中下划线的颜色。
⒉app:tabSelectedTextColor：选中菜单项后字体的颜色。
⒊app:tabTextColor：没有选中是的字体颜色
⒋app:tabMode：其取值有两个属性，fixed与scrollable。
前者使用在固定选项卡，也就是说如果标签很多，那么标签会被挤压。
后则使用在不确定且许多选项卡时，也就是显示的标签在一个屏幕上显示不下的时候，这个标签并不会挤压单个标签来适应屏幕，多余的标签会不显示，但是滑动出不在屏幕的选项卡。
⒌app:tabGravity：两个取值，fill与center。名字可以看出来，选项卡较少情况时使用center选项卡居中，fill依然为填充。
⒍app:tabContentStart：名字看起来没很少见，其实就是整个选项卡距离左边界的距离，也可以说就是marginLeft。
⒎app:tabBackground：就是选项卡的背景色，不设置的情况其颜色与标题栏一样。
⒏app:tabIndicatorHeight：下划线的高度
⒐app:tabMaxWidth：每个选项卡的最大宽度
⒑app:tabMinWidth：每个选项卡的最小宽度
⒒app:tabTextAppearance：使用该属性设置样式可以为标签的头部设置图片。当你在viewpager适配器中getPagerTitle中设置了图片，如果不设置TextAppearance.Design.Tab中textAllCaps设置为false。图片是不会显示的。
⒓app:tabPadding：这个属性与padding一样，有left,end,right等一堆扩展。功能一样。
2.使用TabLayout与ViewPager实现网易首页滚动菜单
布局文件如下：
<LinearLayout 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:orientation="vertical"> <android.support.design.widget.AppBarLayout android:id="@+id/activity_main_appbar" 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/activity_main_toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_scrollFlags="scroll|enterAlways" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"> </android.support.v7.widget.Toolbar> <android.support.design.widget.TabLayout android:id="@+id/activity_main_tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabIndicatorColor="#AD9F79EE" app:tabSelectedTextColor="#FF00FF00" app:tabTextColor="#FF000000" app:tabMode="scrollable" app:tabGravity="center" app:tabContentStart="0dp" app:tabBackground="@android:color/white" app:tabIndicatorHeight="2dp" app:tabMaxWidth="100dp" app:tabMinWidth="50dp" /> </android.support.design.widget.AppBarLayout> <android.support.v4.view.ViewPager android:id="@+id/activity_main_viewpager" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout>
接下来MainActivity中的代码如下：
public void initView(){ Toolbar toolbar = (Toolbar) findViewById(R.id.activity_main_toolbar); toolbar.setTitle("網易"); setSupportActionBar(toolbar); this.tabLayout=(TabLayout)findViewById(R.id.activity_main_tablayout); this.viewPager=(ViewPager)findViewById(R.id.activity_main_viewpager); List<String> titles=new ArrayList<>(); titles.add("头条"); titles.add("宜昌"); titles.add("轻松一刻"); titles.add("财经"); titles.add("科技"); titles.add("移动互联网"); titles.add("健康"); titles.add("读书"); List<LYJFragment> fragments=new ArrayList<>(); for (int i=0;i<titles.size();i++){ this.tabLayout.addTab(this.tabLayout.newTab().setText(titles.get(i)));//创建每一个选项卡 fragments.add(new LYJFragment());//创建每一个ViewPager关联的Fragment } LYJFragmentAdapter adapter = new LYJFragmentAdapter(getSupportFragmentManager(), fragments, titles);//将标题与fragment传入适配器 this.viewPager.setAdapter(adapter); this.tabLayout.setupWithViewPager(this.viewPager); this.tabLayout.setTabsFromPagerAdapter(adapter); } @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.menu_main, menu); return true; }
我们这里不仅要设置viewPager的适配器（viewPager.setAdapter(adapter)）也要设置tabLayout设置adapter。其方法说明：
Any existing tabs will be removed first. Each tab will have it's text set to the value returned from getPageTitle(int)
每个选项卡都要从getPageTitle返回。
关联tabLayout与viewPager就是setupWithViewPager方法。
LYJFragmentPagerAdapter继承自FragmentPagerAdapter,代码如下：
public class LYJFragmentAdapter extends FragmentPagerAdapter { private List<LYJFragment> fragments; private List<String> titles; public LYJFragmentAdapter(FragmentManager fm, List<LYJFragment> fragments, List<String> titles) { super(fm); this.fragments = fragments; this.titles = titles; } @Override public Fragment getItem(int position) { return fragments.get(position); } @Override public int getCount() { return fragments.size(); } @Override public CharSequence getPageTitle(int position) { return titles.get(position); } }
这里的适配器与平常使用的BaseAdapter大同小异，同样的原理。
最后是标题栏的菜单样式：
<menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity"> <item android:id="@+id/lyj_ttf" android:orderInCategory="100" android:icon="@drawable/ic_msg_center_header" android:title="搜索" app:showAsAction="always" /> <item android:id="@+id/lyj_other" app:showAsAction="never" android:title="其他" /> </menu>
使用AppCompatActivity的onCreateOptionsMenu设置到界面标题栏中：
@Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.menu_main, menu); return true; }
本文源码下载地址如下：
