How to style the menu items on an Android action bar

There’s been many questions on styling on action bars, but the ones I’ve found either are relating to styling the tabs, or have answers that don’t work for me.

The question is really quite simple. I want to be able to change the text styling (even just colour) of the menu items in the action bar.

  • Unmarshalling unknown type code
  • Import Cordova project in Android Studio
  • How to get the current location in Google Maps Android API v2?
  • Disable EditText editability and focus (like TextView)
  • Determine date (or version) that app was purchased from Google Play Store - equivalent of iOS appStoreReceiptURL
  • How do I add padding to a bitmap and a color in a layer-list
  • I’ve read this:
    http://android-developers.blogspot.com/2011/04/customizing-action-bar.html?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+blogspot%2FhsDu+%28Android+Developers+Blog%29

    And this question:
    Style an Action Bar in Android Honeycomb

    From which I have put together a test application that I am using to try and get the menu items to change. It uses all the default values for an app created in the eclipse android plugin, except for the following.

    A styles file:

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
    
    <style name="MyAppTheme" parent="@android:style/Theme.Holo.Light">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
    </style>
    
    <style name="MyActionBar" parent="@android:style/Widget.Holo.ActionBar">
        <item name="android:titleTextStyle">@style/MyActionBar.TitleTextStyle</item>
        <item name="android:actionMenuTextAppearance">@style/MyActionBar.MenuTextStyle</item>
    </style>
    
    <style name="MyActionBar.TitleTextStyle"
        parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textColor">#F0F</item>
        <item name="android:textStyle">bold</item>
        <item name="android:textSize">24dip</item>
    </style>
    
    <style name="MyActionBar.MenuTextStyle"
        parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textColor">#F0F</item>
        <item name="android:textStyle">bold</item>
        <item name="android:textSize">24dip</item>
    </style>
    </resources>
    

    A menu for the action bar:

    <?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android">
    
    <item android:showAsAction="always|withText" android:icon="@android:drawable/ic_menu_edit"
        android:id="@+id/menu_item1" android:title="menu_item1"></item>
    
    <item android:showAsAction="always|withText" android:icon="@android:drawable/ic_menu_edit"
        android:id="@+id/menu_item2" android:title="menu_item2"></item>
    
    </menu>
    

    The main activity:

    public class Main extends Activity {
    
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }
    
    /**
     * Create the options menu that is shown on the action bar
     */
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.main_menu, menu);
        return true;
    }
    }
    

    The application compiles and runs. The styling for the action bar title text works perfectly (is that lovely shade of pink #F0F I’ve defined). The menu items do not change appear but with default styling (holo light).

    What am I doing wrong ?

    Related posts:

    Testing an adb update, versus install?
    Android, slidingpanelayout vs navigationDrawer
    Set brightness/contrast in video capture using Android Camera2
    Why retrieving Google Directions for Android using KML data is not working anymore?
    Converting json string to java object?
    Android Hierarchy viewer is not showing timings for rendering
  • Set title for contextual action bar
  • FragmentStatePagerAdapter with ChildFragmentManager - FragmentManagerImpl.getFragment results in NullPointerException
  • In Android, is it possible to change Camera (from front to back) and still keep recording?
  • Lollipop Notification setVisibility() Does Not Work?
  • What are valid return values for a Javascript Interface on an Android WebView?
  • Reading integer field from Java object with C++ (JNI)
  • 7 Solutions collect form web for “How to style the menu items on an Android action bar”

    Instead of having the android:actionMenuTextAppearance item under your action bar style, move it under your app theme.

    I know its an old post, but just in case anyone is looking here. I added this to my style.xml and it worked for me.

    <!-- This is the main theme parent -->
    <style name="MyTabStyle">
        <item name="android:actionBarTabTextStyle">@style/MyTabTextStyle</item>
    </style>
    
    <style name="MyTabTextStyle" parent="@android:style/Widget.ActionBar.TabText">
        <item name="android:textAppearance">@android:style/TextAppearance.Medium</item>
        <item name="android:textSize">14sp</item>
        <item name="android:textStyle">bold</item>
        <item name="android:textColor">@color/pressed_skylogtheme</item>
    </style>
    

    I think the code below

    <item name="android:actionMenuTextAppearance">@style/MyActionBar.MenuTextStyle</item> 
    

    must be in MyAppTheme section.

    You have to change

    <style name="MyActionBar.MenuTextStyle"
    parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
    

    to

    <style name="MyActionBar.MenuTextStyle"
    parent="android:style/TextAppearance.Holo.Widget.ActionBar.Menu">
    

    as well. This works for me.

    Chris answer is working for me…

    My values-v11/styles.xml file:

    <resources>
    <style name="LightThemeSelector" parent="android:Theme.Holo.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/ActionBar</item>
        <item name="android:editTextBackground">@drawable/edit_text_holo_light</item>
        <item name="android:actionMenuTextAppearance">@style/MyActionBar.MenuTextStyle</item>
    </style>
    
    <!--sets the point size to the menu item(s) in the upper right of action bar-->
    <style name="MyActionBar.MenuTextStyle" parent="android:style/TextAppearance.Holo.Widget.ActionBar.Title">
        <item name="android:textSize">25sp</item>
    </style>
    
    <!-- sets the background of the actionbar to a PNG file in my drawable folder. 
    displayOptions unset allow me to NOT SHOW the application icon and application name in the upper left of the action bar-->
    <style name="ActionBar" parent="@android:style/Widget.Holo.ActionBar">
        <item name="android:background">@drawable/actionbar_background</item>
        <item name="android:displayOptions"></item>
    </style>
    
    <style name="inputfield" parent="android:Theme.Holo.Light">
        <item name="android:textColor">@color/red2</item>
    </style>  
    </resources>
    

    My guess is that you have to also style the views that are generated from the menu information in your onCreateOptionsMenu(). The styling you applied so far is working, but I doubt that the menu items, when rendered with text use a style that is the same as the title part of the ActionBar.

    You may want to look at Menu.getActionView() to get the view for the menu action and then adjust it accordingly.

    I did this way:

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="actionMenuTextAppearance">@style/MenuTextAppearance</item>
        <item name="android:actionMenuTextAppearance">@style/MenuTextAppearance</item>
        <item name="actionMenuTextColor">@color/colorAccent</item>
    </style>
    
    <style name="MenuTextAppearance" >
        <item name="android:textAppearance">@android:style/TextAppearance.Large</item>
        <item name="android:textSize">20sp</item>
        <item name="android:textStyle">bold</item>
    </style>
    
    Android Babe is a Google Android Fan, All about Android Phones, Android Wear, Android Dev and Android Games Apps and so on.