How to Set Background Color TabHost

Question

I need help, I'm finding difficulty for change background color in a TabHost.

Original Image:

I need to modify background color like image below.

I tried many things in my code and XML too, but failed.

My code below:

 TabHost tabHost = getTabHost();

        // Tab 1
        TabSpec aba1spec = tabHost.newTabSpec("Tab 1");
        // setting Title and Icon for the Tab
        tabHost.getTabWidget().setStripEnabled(false);
        aba1spec.setIndicator("",getResources().getDrawable(R.drawable.tabenviaarq));
        Intent photosIntent = new Intent(this, MainActivity.class);
        aba1spec.setContent(photosIntent);

    // Adding all TabSpec to TabHost
        tabHost.addTab(aba1spec); // Adding tab1

in XML i have this:

<?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">

    <RelativeLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_above="@android:id/tabs"
            android:layout_alignParentTop="true"/>
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="65dp"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="-5dp"
            android:background="#000000"/>
    </RelativeLayout>
</TabHost>

Somebody have some idea i thanks a lot.

Answer 1

tabHost.setOnTabChangedListener(new OnTabChangeListener() {

        public void onTabChanged(String arg0) {
            for (int i = 0; i < tab.getTabWidget().getChildCount(); i++) {
                tab.getTabWidget().getChildAt(i)
                        .setBackgroundResource(R.drawable.tab_selected); // unselected
            }
            tab.getTabWidget().getChildAt(tab.getCurrentTab())
                    .setBackgroundResource(R.drawable.tab_unselected); // selected

        }
    });

Try this method, I hope this will help you.

Answer 2

Solution is to use background with selector, and the code is here:

private void initTabsAppearance(TabWidget tabWidget) {
    // Change background
    for(int i=0; i < tabWidget.getChildCount(); i++)
        tabWidget.getChildAt(i).setBackgroundResource(R.drawable.tab_bg);
}

Where tab_bg is an xml drawable with selector:

For the full Tab customization I will add the code for changing tab text style using custom theme. Add this to styles.xml:

<style name="MyCustomTheme" parent="@android:style/Theme.Light.NoTitleBar">
    <item name="android:tabWidgetStyle">@style/CustomTabWidget</item>
</style>

<style name="CustomTabWidget" parent="@android:style/Widget.TabWidget">
    <item name="android:textAppearance">@style/CustomTabWidgetText</item>
</style>

<style name="CustomTabWidgetText" parent="@android:style/TextAppearance.Widget.TabWidget">
    <item name="android:textSize">12sp</item>
    <item name="android:textStyle">bold</item>
</style>

To use this theme, define it in AndroidManifest.xml:

<application android:theme="@style/MyCustomTheme">

And now you have tab widgets with custom background and custom text style.