Xeridea
Xeridea

Reputation: 1136

Cannot change active text color on TabLayout

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?

Upvotes: 10

Views: 16747

Answers (3)

veeson
veeson

Reputation: 195

Add below code to your xml:

app:tabSelectedTextColor="@color/app_color"

Upvotes: 9

ashakirov
ashakirov

Reputation: 12350

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>

Upvotes: 14

Xeridea
Xeridea

Reputation: 1136

Edit: got it working,

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

needed called before it was attached to the view pager

Upvotes: 14

Related Questions