AppCompat Toolbar: Change Overflow Icon Color in ActionMode

Question

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

Answer 1

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>

Answer 2

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.

Answer 3

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)

Answer 4

Add the below line into your theme attribute:

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

Answer 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>

Answer 6

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" />