AppCompat Toolbar: Change Overflow Icon Color in ActionMode

问题

With the AppCompat Toolbar, I want to be able to change the color of the overflow menu icon on ActionMode change.

For example, the overflow icon will be white in normal Toolbar mode. And will turn black on ActionMode. So far, I have managed to change the background of the action mode as well as the title text. But I have yet to find a way to change the overflow menu icon color.

I know that there's an answer available: Change ActionMode Overflow icon

I tried the first solution and I wasn't able to find the overflow icon.

The second solution, even with a 50L delay causes the overflow menu icon to flash the ActionMode's intended color for a brief split second that is very jarring.

回答1:

Add the below line into your theme attribute:

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

回答2:

This can be achieved by setting the android:textColorSecondary theme attribute.

For example, suppose you have the following toolbar, which uses the theme MyToolbarStyle:

<android.support.v7.widget.Toolbar
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:id="@+id/main_toolbar"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:minHeight="?attr/actionBarSize"
  theme="@style/MyToolbarStyle"
/>

Next, define the style MyToolbarStyle, inheriting from ThemeOverlay.AppCompat.ActionBar. Finally, modify the color of the overflow icon by adding an item for android:textColorSecondary:

<style name="MyToolbarStyle" parent="ThemeOverlay.AppCompat.ActionBar">
  <item name="android:textColorSecondary">#333333</item>
</style>

回答3:

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
     <item name="android:actionOverflowButtonStyle">@style/ActionButton.Overflow.Icon</item>
 </style>

 <style name="ActionButton.Overflow.Icon" parent="android:style/Widget.Holo.Light.ActionButton.Overflow">
     <item name="android:src">@mipmap/yourwanticon</item>
 </style>

回答4:

Add this code on your res->styles.xml

<style name="ToolbarColored" parent="AppTheme">
<item name="android:textColorSecondary">YOUR_COLOR</item>
</style>

Then your 'ToolbarColored' style in your XCML file like belove

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        app:theme="@style/ToolbarColored"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

回答5:

<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="android:actionOverflowButtonStyle">@style/ActionButtonOverflow</item>

    <!-- Support library compatibility -->
    <item name="actionOverflowButtonStyle">@style/ActionButtonOverflow</item>
</style>

<style name="ActionButtonOverflow" parent="@style/Widget.AppCompat.ActionButton.Overflow">
    <item name="android:tint">@color/brand_white</item>
</style>

回答6:

To correctly change the color of your toolbar's overflow menu icon, set your toolbar's theme to an AppCompat dark ActionBar theme. For example:

In your res/values/style.xml file create a theme that inherits from AppCompat in this manner:

<style name="AppTheme.MyThemeName" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

Now set your toolbar's theme to this theme:

<android.support.v7.widget.Toolbar
  android:id="+id/my_toolbar_id
  android:layout_width="match_parent"
  android:layout_height="@dimen/my_toolbar_height"
  android:theme="@style/AppTheme.MyThemeName">

</android.support.v7.widget.Toolbar>

回答7:

First make your custom style

 <style name="ToolbarColoredBackArrow" parent="AppTheme">
    <item name="android:textColorSecondary">@color/white</item>
 </style>

Then just add it into your toolbar

     <android.support.v7.widget.Toolbar
          android:id="@+id/toolbar"
          android:layout_width="match_parent"
          android:titleTextColor="@color/white"
          app:theme="@style/ToolbarColoredBackArrow"
          android:layout_height="?attr/actionBarSize"
          app:layout_scrollFlags="scroll|enterAlways"
          android:background="?attr/colorPrimary" />

回答8:

If you are using the toolbar in your activity xml you can use something like this

toolbar?.navigationIcon?.setColorFilter(ContextCompat.getColor(this, android.R.color.black), PorterDuff.Mode.SRC_ATOP)

回答9:

<style name="ToolBarTheme" parent="ThemeOverlay.AppCompat.ActionBar">
    <item name="android:tint">@color/colorAccent</item>

create the above theme.set tint with your color and add this theme to the toolbar.

<androidx.appcompat.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ToolBarTheme"/>

回答10:

If you want the white overflow menu icon simply add android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" to your Toolbar layout code.

If you want the dark overflow menu icon use android:theme="@style/Base.Widget.AppCompat.Light.PopupMenu"

So final code is something like:

<android.support.v7.widget.Toolbar
        android:id="@+id/a_main_tb"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:background="@color/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:title="@string/app_name"
        app:titleTextColor="#ffffff"
        />

Also, you should understand that it will change the color of the menu items also.

回答11:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="actionOverflowButtonStyle">@style/CustomOverflowButtonStyle</item>
</style>
<style name="CustomOverflowButtonStyle" parent="Widget.AppCompat.ActionButton.Overflow">
    <item name="android:tint">@color/black</item>
</style>

回答12:

None of the answers here helped me change the overflow icon color of ActionMode independently from the overflow icon color of the normal Toolbar (without resorting to case-by-case styling in code). After some trial and error, I thought that we might override theme attribute of ActionMode independently from Toolbar, and it worked!

In the base theme, we specify the style of action mode like usual:

<style name="BaseTheme" parent="Theme.MaterialComponents.DayNight.Bridge">
        <item name="actionModeStyle">@style/ActionModeStyle</item>
</style>

In our custom ActionModeStyle we do whatever styling we want, and also specify a theme attribute:

<style name="ActionModeStyle" parent="@style/Widget.AppCompat.ActionMode">
        <item name="theme">@style/ActionMode.Theme</item>
</style>

<style name="ActionMode.Theme" parent="ThemeOverlay.AppCompat.Dark">
        <item name="android:textColorSecondary">?attr/colorPrimary</item>
</style>

textColorSecondary will also change the back button color, but we can easily override that one using actionModeCloseButtonStyle.

来源：https://stackoverflow.com/questions/27995461/appcompat-toolbar-change-overflow-icon-color-in-actionmode

标签

android

overflow

toolbar

android-appcompat

actionmode