Android : Change text color of Tab in FragmentActivity

Question

I would like to modify the text color of my Tabs below : (ACCUEIL and A LA UNE)(in black now).

I don't know how to do this.

Here is the code of FragmentActivity :

package com.app.myapp.MainFragment;

import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.FragmentTransaction;
import android.content.Intent;
import android.graphics.Color;
import android.graphics.Typeface;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.widget.TextView;

import com.app.myapp.R;
import com.app.myapp.activities.Recherche_act;

public class TabMainFragment extends FragmentActivity implements ActionBar.TabListener {

    private ViewPager viewPager;
    private TabMainFragmentAdapter mAdapter;
    private ActionBar actionBar;
    // Tab titles
    private String[] tabs = { "ACCUEIL", "A LA UNE" };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        Typeface parade = Typeface.createFromAsset(getAssets(), "fonts/parade.ttf");

        getActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM); 
        getActionBar().setCustomView(R.layout.actionbar);

        TextView title = (TextView) findViewById(R.id.action_bar_title);
        title.setTypeface(parade);
        title.setTextSize(23);
        title.setGravity(Gravity.CENTER_VERTICAL);
        title.setTextColor(Color.WHITE);

        setContentView(R.layout.main_tab_detail_frag);

        //Typeface robotolight = Typeface.createFromAsset(getAssets(), "fonts/Roboto-Light.ttf");

        ActionBar bar = getActionBar();
        bar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#E64260")));

        // Initilization
        viewPager = (ViewPager) findViewById(R.id.pager);
        actionBar = getActionBar();
        mAdapter = new TabMainFragmentAdapter(getSupportFragmentManager());

        viewPager.setAdapter(mAdapter);
        actionBar.setHomeButtonEnabled(false);
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);        

        // Adding Tabs
        for (String tab_name : tabs) {
            actionBar.addTab(actionBar.newTab().setText(tab_name).setTabListener(this));
        }

        /**
         * on swiping the viewpager make respective tab selected
         * */
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {
                // on changing the page
                // make respected tab selected
                actionBar.setSelectedNavigationItem(position);
            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
            }

            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });


    }

    @Override
    public void onTabReselected(Tab tab, FragmentTransaction ft) {
    }

    @Override
    public void onTabSelected(Tab tab, FragmentTransaction ft) {
        // on tab selected
        // show respected fragment view
        viewPager.setCurrentItem(tab.getPosition());
    }

    @Override
    public void onTabUnselected(Tab tab, FragmentTransaction ft) {
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu items for use in the action bar
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.main, menu);
        return super.onCreateOptionsMenu(menu);
    }


    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle presses on the action bar items
        switch (item.getItemId()) {
            case R.id.action_choix_categorie:

                Intent myIntent = new Intent(TabMainFragment.this, Recherche_act.class);
                TabMainFragment.this.startActivity(myIntent);
                overridePendingTransition(R.anim.slide_in_up, R.anim.slide_out_up);

                return true;

            default:
                return super.onOptionsItemSelected(item);
        }
    }

}

Here is an extract of my AndroidManifest :

 <activity android:name="com.app.frisbeee.MainFragment.TabMainFragment" 
            android:theme="@style/Theme.Rosenormal" />

And finally, my style.xml file :

<?xml version="1.0" encoding="utf-8"?>
<!-- File created by the Android Action Bar Style Generator

     Copyright (C) 2011 The Android Open Source Project
     Copyright (C) 2012 readyState Software Ltd

     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at

          http://www.apache.org/licenses/LICENSE-2.0

     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.
-->

<resources>

    <style name="Theme.Rosenormal" parent="@android:style/Theme.Holo.Light">
        <item name="android:actionBarItemBackground">@drawable/selectable_background_rosenormal</item>
        <item name="android:popupMenuStyle">@style/PopupMenu.Rosenormal</item>
        <item name="android:dropDownListViewStyle">@style/DropDownListView.Rosenormal</item>
        <item name="android:actionBarTabStyle">@style/ActionBarTabStyle.Rosenormal</item>
        <item name="android:actionDropDownStyle">@style/DropDownNav.Rosenormal</item>
        <item name="android:actionBarStyle">@style/ActionBar.Solid.Rosenormal</item>
        <item name="android:actionModeBackground">@drawable/cab_background_top_rosenormal</item>
        <item name="android:actionModeSplitBackground">@drawable/cab_background_bottom_rosenormal</item>
        <item name="android:actionModeCloseButtonStyle">@style/ActionButton.CloseMode.Rosenormal</item>
    </style>

    <style name="ActionBar.Solid.Rosenormal" parent="@android:style/Widget.Holo.Light.ActionBar.Solid">
        <item name="android:background">@drawable/ab_solid_rosenormal</item>
        <item name="android:backgroundStacked">@drawable/ab_stacked_solid_rosenormal</item>
        <item name="android:backgroundSplit">@drawable/ab_bottom_solid_rosenormal</item>
        <item name="android:progressBarStyle">@style/ProgressBar.Rosenormal</item>
    </style>

    <style name="ActionBar.Transparent.Rosenormal" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">@drawable/ab_transparent_rosenormal</item>
        <item name="android:progressBarStyle">@style/ProgressBar.Rosenormal</item>
    </style>

    <style name="PopupMenu.Rosenormal" parent="@android:style/Widget.Holo.Light.ListPopupWindow">
        <item name="android:popupBackground">@drawable/menu_dropdown_panel_rosenormal</item>    
    </style>

    <style name="DropDownListView.Rosenormal" parent="@android:style/Widget.Holo.Light.ListView.DropDown">
        <item name="android:listSelector">@drawable/selectable_background_rosenormal</item>
    </style>

    <style name="ActionBarTabStyle.Rosenormal" parent="@android:style/Widget.Holo.Light.ActionBar.TabView">
        <item name="android:background">@drawable/tab_indicator_ab_rosenormal</item>
    </style>

    <style name="DropDownNav.Rosenormal" parent="@android:style/Widget.Holo.Light.Spinner">
        <item name="android:background">@drawable/spinner_background_ab_rosenormal</item>
        <item name="android:popupBackground">@drawable/menu_dropdown_panel_rosenormal</item>
        <item name="android:dropDownSelector">@drawable/selectable_background_rosenormal</item>
    </style>

    <style name="ProgressBar.Rosenormal" parent="@android:style/Widget.Holo.Light.ProgressBar.Horizontal">
        <item name="android:progressDrawable">@drawable/progress_horizontal_rosenormal</item>
    </style>

    <style name="ActionButton.CloseMode.Rosenormal" parent="@android:style/Widget.Holo.Light.ActionButton.CloseMode">
        <item name="android:background">@drawable/btn_cab_done_rosenormal</item>
    </style>

    <!-- this style is only referenced in a Light.DarkActionBar based theme -->
    <style name="Theme.Rosenormal.Widget" parent="@android:style/Theme.Holo">
        <item name="android:popupMenuStyle">@style/PopupMenu.Rosenormal</item>
        <item name="android:dropDownListViewStyle">@style/DropDownListView.Rosenormal</item>
    </style>

</resources>

Answer 1

To achieve this, you need to override android:actionBarTabTextStyle in your custom theme. For example:

<style name="Theme.Rosenormal" parent="@android:style/Theme.Holo.Light">
    ... same as before ...
    <item name="android:actionBarTabTextStyle">@style/ActionBarTabText.Rosenormal</item>
</style>    

and then:

<style name="ActionBarTabText.Rosenormal" parent="@android:style/Widget.Holo.Light.ActionBar.TabText">       
    <item name="android:textColor">#f00</item>
</style>    

You would probably want to use a color resource, the #f00 value is just an example.