Android中TabLayout使用详解

一、     什么是TabLayout

我们在应用viewpager的时候，经常会使用TabPageIndicator来与其配合或者自定义RadioButton来达到很漂亮的效果。但是TabPageIndicator是第三方的和RaidoButton实现起来比较繁琐。在2015年的google大会上，google发布了新的Android Support Design库，里面包含了几个新的控件，其中就有一个TabLayout，它就可以完成TabPageIndicator的效果，而且还是官方的，最好的是它可以兼容到2.2以上版本，包括2.2。

二、使用TabLayout

1、         在gradle中添加依赖 compile 'com.android.support:design:23.1.1' 2、         在布局文件中添加TabLayout <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.TabLayout         android:id="@+id/tab_FindFragment_title"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:background="#f00"         app:tabIndicatorColor="#fff"         app:tabSelectedTextColor="#00f" app:tabMode="scrollable"         app:tabTextColor="#fff"/>     <android.support.v4.view.ViewPager         android:id="@+id/vp_FindFragment_pager"         android:layout_width="fill_parent"         android:layout_height="0dp"         android:layout_weight="1"/> </LinearLayout> 其中： app:tabIndicatorColor="#fff"  //下方滚动的下划线颜色 app:tabIndicatorHeight="10dp"  //滚动的下划线的宽度 app:tabSelectedTextColor="#00f" // tab被选中后，文字的颜色  app:tabTextColor="#fff"  // tab默认的文字颜色  app:tabMode="scrollable"  // Tab可滚动  默认不可以滚动   3、         给ViewPager设置与之关联的TabLayout //给ViewPager添加OnPageChangeListener。TabLayout.TabLayoutOnPageChangeListener(tabLayout) viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout)); 4、         给TabLayout设置相关内容 //设置Tab的内容来自PagerAdapter tabLayout.setTabsFromPagerAdapter(adapter); //设置OnTabSelectedListener监听器来实现TabLayout和ViewPager的联动 tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener(){ @Override public void onTabSelected(TabLayout.Tab tab){ viewPager.setCurrentItem(tab.getPosition()); } @Override public void onTabUnselected(TabLayout.Tab tab){ } @Override public void onTabReselected(TabLayout.Tab tab){ } });

三、     TabLayout官方进一步封装

上面的使用相对比较繁琐，google官方对TabLayout做了进一步封装。 tabLayout.setupWithViewPager(viewPager); 对上面的步骤进行了封装，省去了ViewPager和TabLayout之间的联动手动设置。 一步搞定。 注意：上面这行代码必须在ViewPager的Adapter设置完之后调用，否则会抛异常。