Search code examples
androidandroid-design-library

Styling text on TabLayout


I'm trying to style the new TabLayout from android design library.

<style name="NavigationTab" parent="Widget.Design.TabLayout">
    <item name="tabBackground">@drawable/background_tab</item>
    <item name="tabIndicatorColor">@color/blue</item>
    <item name="tabTextAppearance">@style/NavigationTabTextAppeareance</item>
</style>

And the text is defined right here

<style name="NavigationTabTextAppeareance" parent="TextAppearance.Design.Tab">
      <item name="android:textColor">@color/primary_light</item>
      <item name="android:textSize">12sp</item>
</style>

But the selected tab is always black, how can I change it?


Solution

  • set tabSelectedTextColor in NavigationTab like this:

    <style name="NavigationTab" parent="Widget.Design.TabLayout">
        <item name="tabBackground">@drawable/background_tab</item>
        <item name="tabSelectedTextColor">@color/primary_light</item>
        <item name="tabIndicatorColor">@color/blue</item>
        <item name="tabTextAppearance">@style/NavigationTabTextAppeareance</item>
    </style>
    
    <style name="NavigationTabTextAppeareance" parent="TextAppearance.Design.Tab">
          <item name="android:textColor">@color/primary_light</item>
          <item name="android:textSize">12sp</item>
    </style>