10

I am trying to style tabs in an android.support.design.widget.TabLayout I can not get the selected tab color to change, it is always set to the textColorPrimary in my app theme, but I need them to be different colors.

I have tried setting values in styles.xml that applies to TabLayout, but I read you can not change active tab text color this way, though I can change unselected tab text colors. I have also tried:

tabLayout.setTabTextColors(getResources().getColorStateList(R.color.selector));

and 

tabLayout.setTabTextColors(R.color.Green, R.color.Blue);

Is it possible to override the selected tab text color?

Xeridea
  • 1,146
  • 1
  • 10
  • 17
  • This answer is what you are looking for https://stackoverflow.com/a/31471430/2163045 – murt Aug 25 '17 at 13:05

3 Answers3

14

Edit: got it working, 

tabLayout.setTabTextColors(getResources().getColorStateList(R.color.selector));

needed called before it was attached to the view pager

Xeridea
  • 1,146
  • 1
  • 10
  • 17
  • Is this working for you in v23.0.1 of the support design lib? – AllDayAmazing Sep 28 '15 at 05:42
  • I was trying to use android:textColor="@color/tab_text_color_selector" in the TabLayout xml, but had to use your way with design v23.1.1. Not sure why this is so! :-/ I'll keep looking at my code, but this does the trick. FWIW: getResources(...) is not deprecated. – BK- Nov 18 '15 at 03:57
14

Actually you CAN customize active tab text color via defining custom TabLayout style. Look at tabSelectedTextColor parameter. Here is example of customizing tabSelectedTextColor, tabIndicatorColor, tabTextAppearance (text size/color etc):

<android.support.design.widget.TabLayout
    android:id="@+id/tabLayout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    style="@style/CustomTabLayoutStyle"/>

Styles: 

<style name="CustomTabLayoutStyle" parent="Base.Widget.Design.TabLayout">
    <item name="tabSelectedTextColor">@color/tab_text_selected</item>
    <item name="tabIndicatorColor">@color/tab_indicator</item>
    <item name="tabTextAppearance">@style/CustomTabTexStyle</item>
</style>

<style name="CustomTabTexStyle" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">14sp</item>
    <item name="android:textColor">@color/tab_text</item>
    <item name="textAllCaps">false</item>
    ...
</style>
ashakirov
  • 12,112
  • 6
  • 40
  • 40
9

Add below code to your xml:

app:tabSelectedTextColor="@color/app_color"
veeson
  • 195
  • 2
  • 6