Customizing tabs on state in Android

Question

I know how to put the icon on each tab, that is no problem. I also ran across this : [Stack Overflow thread on pretty much same thing][1]

I followed one of the links from that question and found [this][2]

Pretty much, it said to use a selector defined in the XML, sure, did that. But there is no id associated w/ it so I am not sure how to get the selector function as a drawable so I can use it as the icon for the tabs. Maybe I am going about this the wrong way. But this is what I have, and obviously missing something.

<selector
    android:id="@+id/myselector"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Non focused states -->
    <item
        android:state_focused="false"
        android:state_selected="false"
        android:state_pressed="false"
        android:drawable="@drawable/darklogo" />
    <item
        android:state_focused="false"
        android:state_selected="true"
        android:state_pressed="false"
        android:drawable="@drawable/lightlogo" />

    <!-- Focused states -->
    <item
        android:state_focused="true"
        android:state_selected="false"
        android:state_pressed="false"
        android:drawable="@drawable/lightlogo" />
    <item
        android:state_focused="true"
        android:state_selected="true"
        android:state_pressed="false"
        android:drawable="@drawable/lightlogo" />

    <!-- Pressed -->
    <item
        android:state_pressed="true"
        android:drawable="@drawable/lightlogo" />
</selector>

In my code, an example tab is generated using :

  host.addTab(host.newTabSpec("three")  
                .setIndicator("map",drawables)  
                .setContent(new Intent(this, Map.class))); 

Right now drawable is just a reference to a drawable image resource. How do I make the selector a drawable?

This is my question [1]: Updating Android Tab Icons [2]: http://groups.google.com/group/android-evelopers/browse_thread/thread/ef3bdebcb715b385

Answer 1

The XML you've included here is a way of defining a drawable that lets you embed a case statement. It presents a different drawable depending on the state of the View it's being assigned to. As a drawable, you should save it as an xml file within the res/drawable folder of your project (for example tabselector.xml).

To use it for the Tabhost, you need to construct the TabActivity as you normally would (as shown in this tutorial example).

Then when you add each tab to the host, you specify the tabselector drawable as the indicator as shown for "TAB 1" below.

Drawable mySelector = getResources().getDrawable(R.drawable.tabselector);

mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 1", mySelector).setContent(R.id.textview1));
mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("TAB 2").setContent(R.id.textview2));

Note: You cannot change the color of the tab backgrounds behind the icons at this point.

Answer 2

You could use a View as an indicator, this way you can customize it the way you wish.

mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator(View MyView).setContent(R.id.textview1));
mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("TAB 2").setContent(R.id.textview2));

The first tab will use a View as its indicator and the second a CharSequence. Have a look at the actual TabSpec class (http://developer.android.com/reference/android/widget/TabHost.TabSpec.html).