Change Toolbar Menu Item color (non-hidden action)

Question

Say I have a menu (options_menu.xml) similar to the following:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto" >
    <item android:id="@+id/action_login"
          android:title="Login"
          app:showAsAction="always"/>
</menu>

which I inflate into the new Toolbar item

mToolbar.inflateMenu(R.menu.options_home);

This results in something like

Is there a way to change this text color without using an image, changing the rest of the Toolbar text color, or by adding a custom view to the toolbar? Looking for an answer for minSdk 15 (appcompat).

Update:

My relevant style:

<style name="AppTheme" parent="AppTheme.Base">
    <item name="actionMenuTextColor">@color/ww_red</item>
</style>

<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/red</item>
    <item name="colorAccent">@color/theme_accent</item>

    <item name="android:textColor">@color/text_dark</item>

    <item name="android:colorEdgeEffect">@color/gray</item>
</style>

Answer 1

In your theme file you have to put this :

<style name="AppTheme.ActionBar" parent="Theme.AppCompat.Light.DarkActionBar">
         ...
    <item name="actionMenuTextColor">@color/text_color</item>
         ...
</style>

and apply this theme to your Toolbar view like this :

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   android:id="@+id/main_toolbar"
   android:layout_width="match_parent"
   android:layout_height="?attr/actionBarSize"
   android:background="?attr/colorPrimary"
   android:layout_gravity="top"
   app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
   android:theme="@style/AppTheme.ActionBar"/>

android:theme="@style/AppTheme.ActionBar" don't forget this line in your toolbar

Answer 2

in your style file, place the following:

    <style name="MyAppTheme" parent="@android:style/Theme.Holo.Light">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
        <item name="android:titleTextStyle">@style/MyActionBar.TitleTextStyle 
        <item name="android:actionMenuTextAppearance">@style/MyActionBar.MenuTextStyle</item>
        <item name="android:actionMenuTextColor">@color/action_bar_red</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.Menu">
        <item name="android:textColor">#F0F</item>
        <item name="android:textStyle">bold</item>
        <item name="android:textSize">24dip</item>
    </style>

You can make changes in the above style items to suit your requirements. I have not added separate styling for color though. As you might observe, I am just assigning red color (which I have declared in my colors file) to it. You may change as required.

Answer 3

For me, this worked: Setting the "android:textColor"

<style name="AppTheme.ActionBar" parent="Theme.AppCompat.Light.DarkActionBar">
        ...
        <!--This would set the menu item color-->
        <item name="android:textColor">#000</item>
        ...
 </style>

Answer 4

Not sure if you can set specific backgrounds to separate MenuItems just through styling but you could just setActionView for your MenuItem.

First create a layout like item_av.xml:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#FF0000"
    android:padding="5dp">
    <TextView
        android:text="LOGIN"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:textSize="12sp"
        android:gravity="center"/>
</LinearLayout>

Then set it to your MenuItem in onCreateOptionsMenu:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);

    MenuItem item = menu.findItem(R.id.action_login);
    item.setActionView(R.layout.item_av);

    return true;
}

Answer 5

to change menu item text color use below code

<style name="AppToolbar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:itemTextAppearance">@style/menu_item_color</item>
</style>

where

<style name="menu_item_color">
<item name="android:textColor">@color/app_font_color</item>
</style>

Answer 6

You can do it programmatically like that:

private AppCompatButton menuTextView; 

void initToolbar(){
    toolbar.inflateMenu(R.menu.your_menu);
    menuTextView = AppCompatButton(context);
    menuTextView.setTextColor(ContextCompat.getColor(
    getContext(), R.color.your_color));
    TypedValue outValue = new TypedValue();
    getContext().getTheme().resolveAttribute(
        R.attr.selectableItemBackgroundBorderless,
        outValue,
        true
    )
 toolbar.getMenu().getItem(0).setActionView(menuTextView);