Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Style ActionBar, tab background on selected tab

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.

like image 448
CocoNess Avatar asked Nov 08 '12 08:11

CocoNess


1 Answers

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>
like image 190
CocoNess Avatar answered Nov 18 '22 15:11

CocoNess