Search code examples
androidxmlcolorsandroid-tabhost

How to change the tabIndicator's text color?


I have made a tabhost. Now the problem is I can not change the tabIndicator's background and the text color. I have seen some tutorial and some solution for my problem,,, but I could not understand them how to use that. I have attached my app's picture. It will make you clear about my problem.

enter image description here

here is my activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.shockwaveplayer.MainActivity"
    tools:ignore="MergeRootFrame"
    android:background="@drawable/drk9" >

    <TabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="9dp" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <TabWidget
                android:id="@android:id/tabs"
                style="@style/MyTheme"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

            </TabWidget>

            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <LinearLayout
                    android:id="@+id/tab1"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" >
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab2"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" >
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab3"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" >
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/tab4"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" >
                </LinearLayout>
            </FrameLayout>
        </LinearLayout>
    </TabHost>

    <ListView
        android:id="@+id/listView1"
        android:layout_width="wrap_content"
        android:layout_height="242dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@android:id/tabhost"
        android:divider="#b5b5b5"
        android:listSelector="@drawable/list_selector" >

    </ListView>

</RelativeLayout>

and my mainActivity.java

package com.example.shockwaveplayer;

import java.util.ArrayList;

import android.support.v7.app.ActionBarActivity;
import android.support.v7.app.ActionBar;
import android.support.v4.app.Fragment;
import android.annotation.SuppressLint;
import android.content.Context;
import android.content.Intent;
import android.database.Cursor;
import android.graphics.Color;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;
import android.widget.TextView;
import android.os.Build;
import android.provider.MediaStore;

@SuppressLint("NewApi") public class MainActivity extends ActionBarActivity{

    Context context;
    View decorView;
    TabHost tab;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        context = this;
        ArrayList<String> alv = new ArrayList<String>();
        String selection = MediaStore.Audio.Media.IS_MUSIC + " != 0";
        String[] projection = { 
                MediaStore.Audio.Media._ID,
                MediaStore.Audio.Media.ARTIST, 
                MediaStore.Audio.Media.TITLE,
                MediaStore.Audio.Media.DATA,
                MediaStore.Audio.Media.DISPLAY_NAME,
                MediaStore.Audio.Media.DURATION };
        @SuppressWarnings("deprecation")
        Cursor cursor = this.managedQuery(
                MediaStore.Audio.Media.EXTERNAL_CONTENT_URI, projection,
                selection, null, null);
        @SuppressWarnings("rawtypes")
//      final ArrayAdapter adapter = new ArrayAdapter<String>(this,
//              R.layout.list_row,R.id.title,alv);
        ListView lv = (ListView) findViewById(R.id.listView1);
        tab = (TabHost) findViewById(android.R.id.tabhost);
        tab.setup();
        TabSpec pec = tab.newTabSpec("assignments_tab");
        TabSpec pec2 = tab.newTabSpec("assignments_tab");
        TabSpec pec3 = tab.newTabSpec("assignments_tab");
        TabSpec pec4 = tab.newTabSpec("assignments_tab");

        pec.setContent(R.id.tab1);
        pec2.setContent(R.id.tab2);
        pec3.setContent(R.id.tab3);
        pec4.setContent(R.id.tab4);
        pec.setIndicator("album");
        pec2.setIndicator("artist");
        pec3.setIndicator("songs");
        pec4.setIndicator("playing");
        tab.addTab(pec);
        tab.addTab(pec2);
        tab.addTab(pec3);
        tab.addTab(pec4);   
        Property p = new Property(context,cursor);
        lv.setAdapter(p);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {

        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    /**
     * A placeholder fragment containing a simple view.
     */
    public static class PlaceholderFragment extends Fragment {

        public PlaceholderFragment() {
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            View rootView = inflater.inflate(R.layout.fragment_main, container,
                    false);
            return rootView;
        }
    }

}

How can I change the color? Any help or suggestion?


Solution

  • Try to use like following

    TabWidget tabWidget = getTabWidget();
    TabHost tab = getTabHost();
    
    tab.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
    
        }
    });
    
    
    Intent intent = new Intent(FromClass.this,
                ToClass.class);
    TabSpec tabpiechartActivity = tab.newTabSpec("Name")
                .setIndicator(prepareIndicator("Name"))
                .setContent(intent);
    

    and your prepareIndicator will be

    private View prepareIndicator(String string) {
        View view = LayoutInflater.from(this).inflate(R.layout.customtab, null);
        // ImageView iv = (ImageView) view.findViewById(R.id.TabImageView);
        TextView tv = (TextView) view.findViewById(R.id.tabText);
        // iv.setImageResource(resId);
        tv.setText(string);
        return view;
    }
    

    And your res/layout/customtab xml is:

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/tab_selected"
    android:orientation="vertical" >
    
    <TextView
        android:id="@+id/tabText"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:gravity="center"
        android:textColor="#ffffff"
        android:textSize="15dp" />
    
    </LinearLayout>
    

    And res/drawable/tab_selected.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    <gradient
        android:angle="225"
        android:endColor="#11029E"
        android:startColor="#DD000000" />
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="7dp"
        android:radius="0.1dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="7dp" />
    
    </shape>
    

    And res/drawable/tab_selected.tab_unselected.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >
    
    <stroke
        android:width="1dp"
        android:color="#FFFFFFFF" />
    
    <gradient
    android:angle="225"
    android:endColor="#0F7801"
    android:startColor="#DD000000" />
    
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="7dp"
        android:radius="0.1dp"
        android:topLeftRadius="0dp"
        android:topRightRadius="7dp" />
    
    </shape>
    

    I hope this will help you