TabLayout和ViewPager搭配使用中如何设置Tab背景颜色（无须自定义TabLayout）

TabLayout和ViewPager搭配使用的Tab背景设置

Google官方在14年Google I/O上推出了全新的设计语言——Material Design。一并推出了一系列实现Material Design效果的控件库——Android
Design Support Library。其中，有TabLayout, NavigationView,Floating labels for editing text,Floating Action Button,Snackbar, CoordinatorLayout, CollapsingToolbarLayout等等控件。
如今TabLayout加ViewPager在大家项目开发中都已经司空见惯，如下图所示：



1.改变选中字体的颜色

app:tabSelectedTextColor="@android:color/holo_orange_light"

2.改变未选中字体的颜色

app:tabTextColor="@color/colorPrimary"

3.改变指示器下标的颜色

app:tabIndicatorColor="@android:color/holo_orange_light"

4.设置指示器下标的高度：

app:tabIndicatorHeight="4dp"

5.设置图标：

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

等等。。。。。。

上图的实现过程相信大家应该都很6了，不多说。在这儿我要讲的是如何把TabLayout中的Tab标签设置背景颜色：
如图所示：



这里可以考虑自定义TabLayout，这个网上已经有很多了，在此我就不多赘述，而我偷个懒，是采用选择器selector和shape的搭配实现的这个效果，直接贴代码，一目明了：
shape:
1.未点击的tab效果图

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
>
<corners
android:radius="2dp" />
<solid
android:color="#F0EFF4"/>
<stroke
android:width="0.5dp"
android:color="#C5C0D3"/>

</shape>

2.已点击的tab效果图

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
>
<corners
android:radius="2dp" />
<solid
android:color="@color/orange"/>
<stroke
android:width="0.5dp"
android:color="#C5C0D3"/>

</shape>

接下来就是选择器了

selector:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/tab_shape_oval_press" android:state_selected="true" />
<item android:drawable="@drawable/tab_shape_oval" android:state_focused="false" android:state_pressed="false" android:state_selected="false" />
</selector>

这下就大功告成，实现了Tab的每一栏都有了背景色，简直是So easy啊~