How to Style ActionBar, tab background on selected tab

Question

I'm struggling with styling the ActionBar. My app has an ActionBar with three tabs. I'm trying to get the selected tab to have a background color, and the unselected tabs to show a different color. I'm following this reference: Customizing Action Bar. But all the TABs are showing the Selected color.

My styles.xml file is as follows:

<style name="MyActionBarTabStyle" parent="android:style/Widget.Holo.Light.ActionBar.TabBar">
    <item name="android:background">@drawable/tab_background</item>
    <item name="android:paddingLeft">32dp</item>
    <item name="android:paddingRight">32dp</item>
</style> 

<style name="MyActionBarTabBarStyle" parent="android:style/Widget.Holo.Light.ActionBar.TabBar">

    <item name="android:background">@drawable/red</item>
</style> 


<style name="AppTheme.Light" parent="@android:style/Theme.Holo.Light">
    <item name="android:actionBarStyle">@style/ActionBar.Light</item>
    <item name="android:actionBarTabStyle">@style/MyActionBarTabStyle</item>
    <item name="android:actionBarTabBarStyle">@style/MyActionBarTabBarStyle</item>

</style>

tab_background is just a 9 patch. I'm also not sure if I'm inheriting the action bar tab from the correct parent (parent="android:style/Widget.Holo.Light.ActionBar.TabBar). I've looked through the references & find it very difficult to understand the style hierarchy

Why wont my tabs show selected or no? Thanks in advance for your assistance.

Solution

I solved my problem. I didn't use State List Drawables initially. I used the background image directly instead of going via the StateListDrawable. Using StateListDrawable, you can set a different background based on whether the tag is selected or not.

So I added the file tab_background_select.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true"
        android:drawable="@drawable/tab_background" />

</selector>

and I referenced this from my styles.xml:

 <item name="android:background">@drawable/tab_background_select</item>

Comments

[PravinCG]

Use ActionBarSherlockStyleGenerator to style it and use. Check my answer here

[CocoNess]

Thanks Pravin. The ActionBarStyleGenerator is very useful to style ActionBar

[Admin]

What do you mean you referenced this from styles.xml? How did you reference it and in what way? How do I do that? I can't get it to work. Nothing works for this, it never changes no matter what I do. Android seems really buggy. What parent did you refernece? What did you name it? What did you reference in the manifest?

[tenten]

Nice answer :) use like this,<style name="MyActionBarTabStyle" parent="@android:style/Widget.Holo.Light.ActionBar.TabBar"> <item name="android:background">@drawable/tab_background_select</i‌​tem> </style>