Change color of Navigation Drawer Icon in Android Studio default template
AndroidNavigation DrawerAndroid Problem Overview
The new default Navigation Drawer Activity template in Android Studio
defines its titles and icons in a menu file activity_main_drawer
like this:
<group android:checkableBehavior="single">
<item
android:id="@+id/nav_camara"
android:icon="@drawable/ic_action_emo_cool"
android:title="Import" />
<item
android:id="@+id/nav_gallery"
android:icon="@android:drawable/ic_menu_gallery"
android:title="Gallery" />
<item
android:id="@+id/nav_slideshow"
android:icon="@android:drawable/ic_menu_slideshow"
android:title="Slideshow" />
...
The first item in my example uses a red icon:
but when I run the app, the color of the icon remains black.I have tested this for blue, green, yellow and purple icons, but the result is the same.
I read somewhere that the toolbar should use ThemeOverlay.AppCompat.Dark.ActionBar
and my app already uses this in the styles.xml
file:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
Initially I thought this had something to do with Android Studio's cache feature so I invalidated cache and restarted Android Studio with no luck.
Android Solutions
Solution 1 - Android
Based on @MD's comment, all I needed to do was add:
app:itemIconTint="@color/my_desired_colour"
to NavigationView
(it is located in activity_main.xml
layout file) The default tint is black but you can use an even darker shade of black by using #000000
<android.support.design.widget.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:itemIconTint="#000000"
app:menu="@menu/activity_main_drawer" />
Solution 2 - Android
Create a new style:
<style name="DrawerIconStyle" parent="Widget.AppCompat.DrawerArrowToggle">
<item name="color">@android:color/red</item>
</style>
and in your theme, add this line:
<item name="drawerArrowStyle">@style/DrawerIconStyle</item>
Solution 3 - Android
If you want to set it dynamically you can use:
ActionBarDrawerToggle actionBarDrawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.open_drawer, R.string.close_drawer);
actionBarDrawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.colorAccent));
Solution 4 - Android
Based on @ojonugwa ochalifu and @MD's comment,
You can achieve by writing app:itemIconTint
but if you write this, the navigation drawers icon color will also be changed. The simple and easy solution that I found after lots of R&D is that you have define <item name="colorControlNormal">#FFE730</item>
in theme of AppBarLayout
or if you using Toolbar
only without AppBarLayout
, you can also write <item name="colorControlNormal">#FFE730</item>
in theme or popupTheme
of Toolbar
in your xml.
This will also change the color of activity's back arrow as well.
Hope this helps you all who are facing this type of issue.
Solution 5 - Android
In my case, I was having a style
<style name="MyToolbarStyle" parent="Theme.AppCompat">
<item name="actionOverflowButtonStyle">@style/ActionButtonOverflowStyle</item>
<item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>
<style name="ActionButtonOverflowStyle">
<item name="android:color">@color/colorPrimary</item>
</style>
<style name="DrawerArrowStyle">
<item name="android:color">@color/colorPrimary</item>
</style>
and have applied the theme to the Appbar layout, so programatically chaining color didn't work.
So, try removing any styles that you applied, in case you are not able to change the color of the icon and then try the above given solutions.
Solution 6 - Android
This works for me for changing icon color from the menu xml file which you drag in the app:menu
attribute of the NavigationView
widget.
Use app:iconTint
attribute to set the icon color.
<?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/..."
android:icon="@drawable/ic_person_black_24dp"
android:title="..."
app:iconTint="#FFEB3B" />
<item
android:id="@+id//..."
android:icon="@drawable/ic_settings_black_24dp"
android:title="..."
app:iconTint="#FFEB3B" />
<item
android:id="@+id//..."
android:icon="@drawable/logout"
android:title="..."
app:iconTint="#FFEB3B"/>
</menu>
Solution 7 - Android
I called this method navigationView.setItemIconTintList(null);
in the onCreate
so that i can override the default color of the icon items in navigation drawer like this
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_places);
drawer = findViewById(R.id.drawer_layout);
NavigationView navigationView = findViewById(R.id.nav_view);
navigationView.setNavigationItemSelectedListener(this);
navigationView.setItemIconTintList(null);
}
Then i changed the color of each icon in navigation drawer using this android:iconTint="@color/metallic_blue"
in activity_places_drawer.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:showIn="navigation_view">
<group android:checkableBehavior="single">
<item
android:id="@+id/invite"
android:icon="@drawable/ic_people_orange_24dp"
android:title="@string/menu_invite"
android:fontFamily="@font/roboto_medium" />
</group>
Hope this answer helps.
Solution 8 - Android
I have changed my drawer menu icon color by doing this line of code:
actionBarDrawerToggle.getDrawerArrowDrawable()
.setColor(getResources().getColor(R.color.colorAccent));
Solution 9 - Android
Just use this code:
navigationView.setItemIconTintList(null);
Solution 10 - Android
You must change the colorAccent in the colors file to which ever color you want :
<color name="colorAccent">whichever color required</color>
This solution worked for me
Solution 11 - Android
add itmIconTint in navigation view
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/drawerbackgtound"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:itemTextColor="@color/white"
app:iconTint="#FFFFFF"
app:itemIconTint="#FFFFFF"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/activity_main_drawer" />