how to change the color of the tabs indicator text in android?

Question

how to change the color of the text indicator of tab? i can change the icon using selector tag refered the example. but cant to the text color. how?

Answer 1

The change in color can also be stated without using java - which is probably better.

I made changes to the text_tab_indicator (notice textColor was changed to 'color'):

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:color="@color/text_tab_selected" />
    <item android:state_selected="false" android:color="@color/text_tab_unselected" />
</selector>

Set the style of the TabWidget to point to a specific style in your xml code:

<TabWidget
    ...
    style="@style/TabText"
    />

Declare your text_tab_indicator located in /res/color as you desired color in the style

<style name="TabText">
    <item name="android:textColor">@color/tab_text_color</item>
</style>

It worked like a charm (for me).

Cheers, Randall

Answer 2

Danny C's answer is 100% correct.I just wanted to add something to it to make a complete answer with resource file.

The text_tab_indicator under res/color file

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:textColor="@color/text_tab_selected"
    android:state_selected="true" />
<item android:textColor="@color/text_tab_unselected"
    android:state_selected="false" />
</selector>

And this text_tab_unselected & text_tab_selected will look like this under colors/values folder

<resources> 
<color name="text_tab_selected">#ffffff</color>
<color name="text_tab_unselected">#95ab45</color>

After that finally add Dannyy's answer in tab class file

final TextView tv = (TextView) tabWidget.getChildAt(i).findViewById(android.R.id.title);        
tv.setTextColor(this.getResources().getColorStateList(R.color.text_tab_indicator));

Answer 3

Style it in your custom theme change

<item name="android:tabWidgetStyle">@android:style/Widget.TabWidget</item> 

and

<style name="Widget.TabWidget">
        <item name="android:textAppearance">@style/TextAppearance.Widget.TabWidget</item>
        <item name="android:ellipsize">marquee</item>
        <item name="android:singleLine">true</item>
</style>  


<style name="TextAppearance.Widget.TabWidget">
    <item name="android:textSize">14sp</item>
    <item name="android:textStyle">normal</item>
    <item name="android:textColor">@android:color/tab_indicator_text</item>
</style>     

Answer 4

Here is a new answer I found from Fred Grott (http://knol.google.com/k/fred-grott/advance-tabs/) after a little web searching.
This lets you set a selector for text color so a different color can be used when tab is selected or not. Which can be very useful if you are using a different background color for the tab if its selected. Of course you can also just throw in a plain color and not a selector.

final TextView tv = (TextView) tabWidget.getChildAt(i).findViewById(android.R.id.title);        
tv.setTextColor(this.getResources().getColorStateList(R.color.text_tab_indicator));

Where R.color.text_tab_indicator is a selector xml file located in your res/drawable folder.

In other words, the indicator text really is a TextView which is retrievable via the View object which can be accessed from the TabWidget object.
Take a look at Fred's examples for more info and context regarding the variable declarations as well as other tricks.