How to tint AppCompat r22.1 action bar overflow icon?

Question

I know it's possible to replace the icon by setting a custom actionOverflowButtonStyle as described here. However, that style only allows setting a different drawable and or/background.

Instead, I would like to use the standard icon provided by AppCompat, just tinting it with a particular color, just as the drawer icon/back button can be tinted via the color attribute in drawerArrowStyle.

I have tried these methods, which reportedly used to work:

Setting colorControlNormal -- Toolbar icon tinting on Android
Setting textColorPrimary in the theme -- MenuItem tinting on AppCompat Toolbar
Setting a custom actionBarStyle and changing colorControlNormal there.

But as far as I can see none of them work with the latest AppCompat -- the overflow icon keeps its original color (while other widgets, such as TextViews or the text in menu items do change).

Should this be done differently now? I am not using a custom Toolbar view, just the default AppCompat-provided, ActionBar-like one.

How to reproduce:

Create a default Android Studio project, with minimum SDK version = 9.
This automatically includes a blank activity and a menu resource with a single menu item, "Settings", with app:showAsAction="never" which means it will be displayed in the overflow menu.

Finally, customize the styles.xml file. For example:

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorPrimary">#008888</item>
        <item name="colorControlNormal">#ff0000</item>
        <item name="android:textColorPrimary">#ff0000</item>
    </style>
</resources>

You'll notice that neither property affects the overflow menu icon color. Tested in a Nexus 5 with Android 5.1.1.

@karaokyo Done, though it's extremely easy to reproduce -- a default new Android Studio project is enough. — matiash
Oh, ok so it's the DarkActionBar forcing the white overlay. Don't use DarkActionBar? — tachyonflux

tachyonflux tachyonflux · Accepted Answer · 2015-05-28T01:35:55

If you trace the Theme.AppCompat.Light.DarkActionBar theme, you see that it sets:

<item name="actionBarTheme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>

Which in turn inherits from Base.ThemeOverlay.AppCompat.Dark, which sets:

<item name="android:textColorPrimary">@color/abc_primary_text_material_dark</item>

Which essentially equals white:

<color name="primary_text_default_material_dark">#ffffffff</color>

If you just inherit from Base.Theme.AppCompat.Light, you won't run into this issue since it doesn't set the actionBarTheme. You can easily customize the action bar using the material properties anyway.

How to tint AppCompat r22.1 action bar overflow icon?

1 Answers