CODEWITHSUNDEEP
androidpopupmenumaterial-design-3
Mark Delphi
Mark Delphi

Reputation: 1765

How to change the icon color of PopupMenu (Material Design 3 )in Android?

I am trying to implement a PopupMenu in my app following this example. It works, but I can't change the icon color. How would I achieve that?

Meanwhile I could change the background color:

<style name="Theme.MyApp" parent="Theme.Material3.DayNight.NoActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorBackground</item>
    <item name="android:navigationBarColor">@color/colorWhite</item>
    <item name="android:windowBackground">@color/colorBackground</item>

    <item name="popupMenuStyle">@style/Widget.App.PopupMenu</item>

    <item name="colorControlNormal">@color/colorSecondary</item> // <--- This one has no effect
</style>

<style name="Widget.App.PopupMenu" parent="Widget.Material3.PopupMenu">
    <item name="android:popupBackground">@drawable/menu_back</item> // <-- This changes background and it works good.
    <item name="colorControlNormal">@color/colorSecondary</item> // <--- Even placed here still doesn't work
    <item name="android:colorControlNormal">@color/colorSecondary</item> // <-- even with android:
</style>

I am using the new Material Design 3 library from Google.

Also, I tried to find something on Internet and I could only find solutions for my issue regarding PopupMenu on Toolbar, which is not my case. I need a PopupMenu when a button is clicked.

Upvotes: 0

Views: 643

Answers (1)

bmsbms16
bmsbms16

Reputation: 70

I previously searched for a solution to this problem and found this solution the best (even night mode can be supported)

in your menu.xml file In the following example it menu_items_options.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_share"
        android:title="share"
        android:icon="@drawable/round_ios_share_24"
        app:iconTint="?attr/colorOnSurface"
        />

    <item
        android:id="@+id/menu_select"
        android:title="select"
        android:icon="@drawable/round_select_all_24"
        app:iconTint="?attr/colorOnSurface"
        />

</menu>

add

app:iconTint="?attr/colorOnSurface"

You can change to the "?attr/colorOnSurface" color you want (and it is better to use what I mentioned) for a better experience with day and night mode

Note: "app:iconTint" Not "android:iconTint"

Upvotes: 1

Related Questions