AppCompat ToolBar popupTheme not used in the ShareAction MenuItem

Question

Context

Using the AppCompat v7 21.0.0 / 21.0.2 / 21.0.3

Problem

The popupTheme of the ToolBar is not applied to the ShareAction

Style on the toolbar:

<style name="MyActionBarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="android:background">@color/green</item>
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

The overflow menu item is using the popupTheme properly

Overflow Item

The ShareAction on the other hand does not receive the popupTheme. After some testing I noticed it received the app:theme of the ToolBar thus being dark.

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

ShareAction Menu Item

In order to get the black text on the ShareAction I tried setting many attributes and by setting "android:textColorPrimary" (on the ToolBar theme) I get what I want BUT then my icons on the ToolBar also takes this color which is weird...

The menu xml is the following:

<?xml version="1.0" encoding="utf-8"?>

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:cycle="http://schemas.android.com/apk/res-auto">

    <item
        android:id="@+id/ic_share"
        android:icon="@drawable/abc_ic_menu_share_holo_dark"
        android:title="@string/media_share"
        cycle:showAsAction="ifRoom"
        cycle:actionProviderClass="android.support.v7.widget.ShareActionProvider" />
    <item
        android:icon="@drawable/abc_ic_menu_share_holo_dark"
        android:showAsAction="ifRoom"
        android:title="br">
        <menu>
            <item
                android:id="@+id/menuSortNewest"
                android:title="Sort by newest" />
            <item
                android:id="@+id/menuSortRating"
                android:title="Sort by rating" />
        </menu>
    </item>

</menu>

I would expect both the ShareAction & the overflow to have the popupTheme but it's not the case

Workaround

I'll edit this post once I got a workaround

Ref: https://code.google.com/p/android/issues/detail?id=87285&thanks=87285&ts=1419254842

score 30 · Accepted Answer · answered Mar 09 '15 at 22:54

So, here's what worked for me. Here's my Toolbar xml:

<?xml version="1.0" encoding="utf-8"?>
<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/action_bar_main"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    app:theme="@style/Toolbar"
    app:popupTheme="@style/Toolbar_Popup"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary" />

Notice that I set both theme and popupTheme, and I also override background to be colorPrimary. Here's the main app theme description with themes for Toolbar:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:actionMenuTextColor">@color/white</item>

    <!-- Support library compatibility -->
    <item name="actionMenuTextColor">@color/white</item>

    <item name="actionBarSize">@dimen/actionbar_height</item>

    <item name="colorPrimary">@color/dark_blue</item>
    <item name="colorPrimaryDark">@color/dark_blue</item>
    <item name="android:textColorPrimary">#607d8b</item>

</style>

<style name="Toolbar" parent="Base.ThemeOverlay.AppCompat.ActionBar">
    <item name="android:textColorPrimary">#fff</item>
    <item name="android:background">@color/dark_blue</item>
</style>

<style name="Toolbar_Popup" parent="Base.ThemeOverlay.AppCompat.ActionBar">
    <item name="android:textColorPrimary">#fff</item>
    <item name="android:background">@color/dark_blue</item>
</style>

So, as a result, Share action background is set to the value of background in the main Toolbar theme. And the background of Toolbar itself is overriden.

Something useful to add would be true, for me the selector was only showing as a border around the words in the list when pressed otherwise — Daniel Wilson, Mar 18 '15 at 11:49
@Max yah it doesn't. what is the new solution from v7:23.1.1 — Edijae Crusar, Nov 15 '16 at 15:10

score 1 · Answer 2 · answered Jun 20 '16 at 11:40

I was scratching my head for ages trying to solve this. I found a solution to my problem. Hopefuully this will help others also:

In my toolbar definition I was setting a custom theme like so:

<android.support.v7.widget.Toolbar     
    ...
    app:theme="@style/ActionBarThemeOverlay"
    ... />

In my styles.xml, my theme was defined as:

<style name="ActionBarThemeOverlay" parent="ThemeOverlay.AppCompat.Light">
    <item name="android:textColorPrimary">#fff</item>
    <item name="colorControlNormal">#fff</item>
    <item name="colorControlHighlight">#3fff</item>
</style>

I wanted white action icons in my toolbar, so I was setting these values to white. Unfortunately it was also making my ShareActionProvider menu text white (on a white background).

The solution for me was to remove the style setting for textColorPrimary. My toolbar icons were still white but I now had the desired dark text in the popup share provider menu.

<style name="ActionBarThemeOverlay" parent="ThemeOverlay.AppCompat.Light">
    <item name="colorControlNormal">#fff</item>
    <item name="colorControlHighlight">#3fff</item>
</style>

score 0 · Answer 3 · answered Nov 04 '14 at 16:00

0

This page may helps to solve your problem: http://www.murrayc.com/permalink/2014/10/28/android-changing-the-toolbars-text-color-and-overflow-icon-color/

One difference I noticed in your XML is that you once use the property android:showAsAction="ifRoom" and once cycle:showAsAction="ifRoom".

answered Nov 04 '14 at 16:00

Lukas

2,544
2
18
33

1

Yes the android/cycle is a copy paste mistake. and the website does not talk about this particular problem, it is in fact a bug in the AppCompat lib that will be fixed soon – Benoit Nov 07 '14 at 14:15

AppCompat ToolBar popupTheme not used in the ShareAction MenuItem

3 Answers3

Linked