CODEWITHSUNDEEP
androidandroid-design-library
Javier Manzano
Javier Manzano

Reputation: 4821

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?

Upvotes: 15

Views: 24237

Answers (2)

Vivek
Vivek

Reputation: 189

If you just have to give different text color then there is direct option by using app:tabTextColor for unselected and app:tabSelectedTextColor for selected tab text like in example .

<android.support.design.widget.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabTextColor="#607D8B"
            app:tabSelectedTextColor="#FFFFFF"/>

Upvotes: 7

JeKa
JeKa

Reputation: 590

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>

Upvotes: 35

Related Questions