AppCompat ToolBar popupTheme not used in the ShareAction MenuItem

31,886

Solution 1

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.

Solution 2

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>
Share:
31,886
Benoit
Author by

Benoit

Android developer, Computer enthusiast

Updated on July 09, 2022

Comments

  • Benoit
    Benoit almost 2 years

    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