68

I defined a menu item that has ShareActionProvider and share white icon like so :

<item
    android:icon="@drawable/ic_share_white_24dp"
    android:id="@+id/action_share"
    android:title="@string/action_share"
    android:orderInCategory="200"
    app:showAsAction="ifRoom"
    app:actionProviderClass="android.support.v7.widget.ShareActionProvider"/>

But when I launch the application, I get a different black share icon. How to set the share icon to be white?

Here is the result that I have

enter image description here

1
  • app:iconTint="@color/yourcolor" Mar 30, 2022 at 3:08

9 Answers 9

74

The icon is actually provided by the ShareActionProvider and you can't change it afaik. You can, however, customize the color by setting the textColorPrimary in your styles.xml:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    app:theme="@style/MyActionBarTheme"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

<style name="MyActionBarTheme" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:textColorPrimary">#fa0</item>
</style>

For any custom icons, you would have to color them yourself, ie.

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);

    for(int i = 0; i < menu.size(); i++){
        Drawable drawable = menu.getItem(i).getIcon();
        if(drawable != null) {
            drawable.mutate();
            drawable.setColorFilter(getResources().getColor(R.color.textColorPrimary), PorterDuff.Mode.SRC_ATOP);
        }
    }

    return true;
}
3
  • @YoannHercouet Are you trying to change the color of some other icon and not a ShareActionProvider icon as this question is specifically asking for? Are you using a Toolbar? Apr 4, 2016 at 21:20
  • The question specifies MenuItems, but anyway I gave it a try with the ShareActionProvider. I realized this icon is set automatically so you don't need to set one, you only need to change the theme as BladeCoder explained, and it will be displayed in white automatically. I tried setting textColorPrimary as you said, it does not change anything, and even if it would, it would not only change the ActionBar or ToolBar but all the titles and many components in the app. Apr 5, 2016 at 7:50
  • @YoannHercouet well, some things might have changed, but the ShareActionProvider and overflow menu are still affected by textColorPrimary, if the toolbar is styled for it. For any custom icons, you would have to color them yourself. Apr 5, 2016 at 15:58
68

Short and Sweet Answer--> app:iconTint="@color/yourcolor

add app:iconTint="@color/yourcolor" in your MenuItem for change the Icon color.

<item
    android:icon="@drawable/ic_share_white_24dp"
    android:id="@+id/action_share"
    android:title="@string/action_share"
    android:orderInCategory="200"
    app:iconTint="@color/yourcolor"
    app:showAsAction="ifRoom"
    app:actionProviderClass="android.support.v7.widget.ShareActionProvider"/>
5
  • 3
    This is not a bad solution if you want to re-color it from menu-XML: the namespace then should be android: instead of app: android:iconTint="@android:color/white". Important: Attribute iconTint is only used in API level 26 and higher!
    – Danny
    Aug 22, 2018 at 15:35
  • 32
    @danny.schimke use app: insted of android: then it ll use in below 26 api Aug 22, 2018 at 15:38
  • 4
    you're right, with app:iconTitle it even work below API 26 - thanks! Maybe people get confused because in my IDE it's not correctly shown in preview, but correct recolored at runtime! Your solution works very well and don't deserve a down-vote!
    – Danny
    Aug 22, 2018 at 15:57
  • Note, I was using a system icon and even using iconTint as "#FFFFFF", it was still like a gray colour. I ended up creating a new Vector Asset to get a fully white icon properly. Oct 11, 2019 at 20:00
  • 1
    Thanks @NikunjParadva it work like i want thumbs up Mar 30, 2022 at 3:07
48

This is a theming issue. Depending on your current theme, you need to set the correct ActionBar overlay theme. The Action Provider reads a value in the theme (which indicates if the theme is dark or light) to determine the color of the icon.

If your main theme is light and your ActionBar is dark, your ActionBar/Toolbar must use the theme ThemeOverlay.AppCompat.Dark.ActionBar.

7
  • I am the theme Theme.AppCompat.Light.NoActionBar, how can I achieve that?
    – Dimitri
    Aug 12, 2015 at 6:23
  • 5
    Indeed your main theme is light and you are using a Toolbar. You need to specify android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" as attribute on your Toolbar in your XML layout. If you want the toolbar popup menu to be light while the toolbar is dark, you also need to add app:popupTheme="@style/ThemeOverlay.AppCompat.Light".
    – BladeCoder
    Aug 12, 2015 at 10:45
  • If I set the theme android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar, is he going to change the color of my toolbar?
    – Dimitri
    Aug 12, 2015 at 12:12
  • 2
    This will only change the overflow icon, not the menu items color Apr 4, 2016 at 16:41
  • 1
    Hint: you can find many icons in black AND white colors here: github.com/google/material-design-icons
    – stefan.m
    Jul 25, 2017 at 21:05
42

try this :

public boolean onCreateOptionsMenu(Menu menu) {

    getMenuInflater().inflate(R.menu.MENU, menu);

    // change color for icon 0 
    Drawable yourdrawable = menu.getItem(0).getIcon(); // change 0 with 1,2 ... 
    yourdrawable.mutate();
    yourdrawable.setColorFilter(getResources().getColor(R.color.white), PorterDuff.Mode.SRC_IN);
    return true;
}       
1
  • I tried the accepted answer and it didn't work for me. This answer was a clutch to get my assignment done on time. Oct 16, 2023 at 15:24
7

color of icons in menu can change in Layout/activity_main.xml

set this line app:itemIconTint="@color/red_warning inside this tag com.google.android.material.navigation.NavigationView

    <?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
        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:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        tools:openDrawer="start">

    <include
            layout="@layout/app_bar_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>


    <com.google.android.material.navigation.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:fitsSystemWindows="true"
            app:headerLayout="@layout/nav_header_main"
            app:menu="@menu/activity_main_drawer"
            app:itemIconTint="@color/red_warning"
    />


</androidx.drawerlayout.widget.DrawerLayout>

enter image description here

1
  • This is perfect it works!. app:itemTextColor="@color/white" app:subheaderColor="@color/white" Aug 15, 2023 at 17:41
6

short Answer --> use app:iconTint="?android:textColorPrimary" if you want the icon color to be white, write: android:theme = "@style/ThemeOverlay.MaterialComponents.Dark.ActionBar" else if you want black color, write: android:theme="@style/ThemeOverlay.MaterialComponents.Light" to your toolbar

2
  • Hi, welcome to StackOverflow. Since this question already has several popular answers including an accepted one, please edit your answer to describe the behaviour of this slightly different solution and why you feel it is of assistance. Thanks.
    – MandyShaw
    Feb 2, 2019 at 21:18
  • <style name="AppTheme" parent="Theme.MaterialComponents.Light">, its works for me thanks
    – Ashwin H
    Aug 24, 2022 at 5:19
3
@Override
public void onCreateOptionsMenu(Menu menu, MenuInflater menuInflater) {
    menuInflater.inflate(R.menu.menu_confirm, menu);
    MenuItem action_done = menu.findItem(R.id.action_done);
    action_done.setIcon(R.drawable.ic_filter);
    Utils.menuIconColor(action_done, Color.WHITE);
    super.onCreateOptionsMenu(menu, menuInflater);
}

public static void menuIconColor(MenuItem menuItem, int color) {
    Drawable drawable = menuItem.getIcon();
    if (drawable != null) {
        drawable.mutate();
        drawable.setColorFilter(color, PorterDuff.Mode.SRC_ATOP);
    }
}
0
2
 app:iconTint="@color/colorWhite" 

add this in Navigational view properties

Ex -

<com.google.android.material.navigation.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/main_color"
        app:itemBackground="@drawable/divider_menu_items"
        app:itemTextColor="@color/colorWhite"
        app:itemIconTint="@color/colorWhite"
        app:menu="@menu/activity_main_drawer"/>

Adding this all menu item icons convert to color given by you.

0

This behaviour is expected, as the ShareActionProvider is

responsible for creating views that enable data sharing and also to show a sub menu with sharing activities if the hosting item is placed on the overflow menu.

according to the documentation.

This means that you don't have control over the customization of the view when using it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.