Search code examples
androidandroid-toolbarandroidxandroid-theme

How to change menu icon color in androidx toolbar?


I get a layout with an androidx.appcompat.widget.Toolbar

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff"
    tools:context=".Activity.Home">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:theme="?attr/actionBarTheme"
        app:layout_constraintTop_toTopOf="parent"
        android:backgroundTint="#4862ed"
        app:titleTextColor="#ffff"/>

</androidx.constraintlayout.widget.ConstraintLayout>

So I want to change the color of the three-dots menu icon set in the Toolbar, but I didn't find any solution which works correctly.

I tried to defined a new style, set from the activity or change it inside the xml declaration but nothing works.

Someone could help me?


Solution

  • With a Material Components Theme you can use:

    <androidx.appcompat.widget.Toolbar
        android:theme="@style/ThemeOverlay.App.Toolbar"
        ...>
    
      <style name="ThemeOverlay.App.Toolbar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
        <!-- color used by navigation icon and overflow icon -->
        <item name="colorOnPrimary">@color/myColor</item>
      </style>
    

    With an AppCompat Theme:

    <androidx.appcompat.widget.Toolbar
      app:theme="@style/ThemeOverlay.App.Toolbar" />
    
    
    <style name="ThemeOverlay.App.Toolbar" parent="Theme.AppCompat.Light">
    
       <!-- navigation icon color -->
       <item name="colorControlNormal">@color/my_color</item>
    
        <!-- color of the menu overflow icon -->
        <item name="android:textColorSecondary">@color/my_color</item>
    </style>