Android Lollipop Material Design Overflow Menu Icon color

Question

I try the new Material Design on a Nexus 7 and have the following strange behaviour. The Overflow Menu Icon has a different color on the first app launch.

I changed the android:textColorPrimary color and read this tutorial.

1. First App launch:

2. Second App launch:

As you see the color of the primary text color is not set on the first launch. It is only set if i press the home button and relaunch the app. Here is my styles.xml file:

<style name="AppBaseTheme" parent="android:Theme.Material.Light">
    <item name="android:colorPrimary">#FF4444</item>
    <item name="android:colorPrimaryDark">#CC0000</item>
    <item name="android:textColorPrimary">#000000</item>
</style>

Can someone explain, why that behaviour occurs?

I set android:minSdkVersion="21" and don't want to use support libraries.

Answer 1

I experienced the same problem when running a PreferenceActivity which cannot use appcompat-v7 library on a LOLLIPOP device. When this activity is opened for the first time the overflow icon is always white completely ignoring android:textColorPrimary and android:colorControlNormal. Subsequent runs or orientation changes however result in proper coloring.

I created a gist which will help you mitigate this. The code binds a global layout observer to the toolbar and when it finds an overflow icon it replaces it and unbinds the observer. So don't use it in places where you don't expect an overflow icon because the observer won't get unbound in that case.

Link to gist: https://gist.github.com/consp1racy/4b640679de553fdb3046

Answer 2

Just add the secondary text color for the options menu, i.e.:

<item name="android:textColorSecondary">@color/text_color</item>

In some circumstances the secondary color is set to the primary color. I don't know yet why.

Answer 3

Add these items too:

<item name="actionMenuTextColor">@color/white</item>
<item name="android:actionMenuTextColor">@color/white</item>

If this didn't help, then try this:

<style name="AppBaseTheme" parent="android:Theme.Material.Light">
    <item name="android:itemTextAppearance">@style/TextAppearance</item>
</style>

<style name="TextAppearance">
    <item name="android:textColor">@android:color/white</item>
</style>

This would works for Holo.Light.DarkActionBar