Styling Android tabs with xml

You must Login before you can answer or comment on any questions.

I'm trying to style the default Android tabs so that they appear at the bottom and that they have a different background color. I've already managed to place them at the bottom. But the background color isn't changing.

This is what i have so far. One xml file called titanium_tabgroup.xml:

<?xml version="1.0" encoding="utf-8"?> 
<TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/tabhost" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 
    <LinearLayout 
        android:orientation="vertical" 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent" 
        android:padding="0dp" 
        android:background="@drawable/tab_selector" > 
 
        <FrameLayout 
            android:id="@android:id/tabcontent" 
            android:layout_width="fill_parent" 
            android:layout_height="fill_parent" 
            android:padding="0dp" 
            android:layout_weight="1" /> 
 
        <TabWidget 
            android:id="@android:id/tabs" 
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content" 
            android:layout_weight="0" /> 
    </LinearLayout> 
</TabHost>
Notice that in there i'm specifying a background in the LinearLayout tag.

In the xml file tab_selector.xml i have:

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
 
    <item android:state_pressed="true"> 
        <shape>  
            <gradient  
                android:endColor="#ffffff"  
                android:startColor="#AAAAAA"  
                android:angle="270" />  
            <stroke  
                android:width="1px"  
                android:color="#000000" />  
        </shape> 
    </item> 
 
    <item 
        android:state_selected="false"  
        android:state_focused="false"  
        android:state_pressed="false"> 
        <shape>  
            <gradient  
                android:endColor="#ffffff"  
                android:startColor="#AAAAAA"  
                android:angle="270" />  
            <stroke  
                android:width="1px"  
                android:color="#000000" />  
        </shape> 
    </item> 
 
    <!-- and the other states. They are the same as the ones above --> 
    ... 
    ... 
    ... 
 
</selector>
But this doesn't change the background color of the tabs. It still shows me the old original Android tabs.

Any idea how i can make this work? Perhaps with a slightly different method?

Your Answer

Think you can help? Login to answer this question!