效果图：
TabLayout使用如下：
<?xml version="1.0" encoding="utf-8"?>
<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_layout"
android:layout_width="match_parent"
android:layout_height="@dimen/tablayout_height"
app:tabBackground="@drawable/tablayout_background"
app:tabIndicatorHeight="0dp"
app:tabSelectedTextColor="@color/white"
app:tabTextAppearance="@style/TabLayoutTextStyle"
app:tabTextColor="@color/white" />
<View
android:id="@+id/view_pager_line"
android:layout_width="match_parent"
android:layout_height="1px"
android:background="@color/divider_color" />
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>其中app:tabBackground=”@drawable/tablayout_background”中为自定义selector，代码如下：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/tab_horizontal_item_p" android:state_selected="true" />
<item android:drawable="@drawable/tab_horizontal_item_d" />
</selector>app:tabTextAppearance=”@style/TabLayoutTextStyle”为自定义style：
<style name="TabLayoutTextStyle">
<item name="android:textSize">@dimen/text_16_sp</item>
</style>如果去掉TabLayout 自带 滚动条，可是如下配置：
app:tabIndicatorHeight="0dp"原文：http://blog.csdn.net/ming2316780/article/details/51763864 本文略有改动。