How to change drawer layout icon colours

Question

I'm updating an existing project from a different developer in our company and am trying to set the colour of the icons to match the text (as you can see from the screenshot below). I've succeeded for the current selected item but not for the items that aren't selected. I cannot figure out why either of these do/don't work at the moment.

My layout

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/coordinator_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <include layout="@layout/appbar_basic"/>

        <android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <include layout="@layout/activity_home_content"/>

        </android.support.v4.widget.NestedScrollView>

    </android.support.design.widget.CoordinatorLayout>

    <include layout="@layout/navigation_view"/>

</android.support.v4.widget.DrawerLayout>

My code

@Bind(R.id.drawer_layout)
DrawerLayout mDrawerLayout;

private void initDrawer() {
    Menu m = mNavigationView.getMenu();

    for (ModuleVO module : Modules.getActiveModules()) {
        m.add(0, module.id, 1, module.textRef).setIcon(module.drawerIconRef);
    }
}

I have already done some searching and tried a couple of things, including the answers listed here:

• Changing text color of menu item in navigation drawer
• How to style Menu Items in Navigation Drawer in Android?

Using app:itemIconTint doesn't work and neither does writing a selector. The only way I've been able to change the colours has been by changing these attributes in my themes.xml file.

<?xml version="1.0" encoding="utf-8"?>

<resources xmlns:android="http://schemas.android.com/apk/res/android">
    <style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:textColorPrimary">@color/text</item>
        <item name="android:textColorSecondary">@color/primary</item>
    </style>
</resources>

I will be happy to provide more information/code if required to solve the issue!

Answer 1

I found the answer! When looking over my layout file again I found <include layout="@layout/navigation_view"/> and when I applied a selector to navigation_view it worked! Below is my working code.

activity_home.xml

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/coordinator_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <include layout="@layout/appbar_basic"/>

        <android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <include layout="@layout/activity_home_content"/>

        </android.support.v4.widget.NestedScrollView>

    </android.support.design.widget.CoordinatorLayout>

    <include layout="@layout/navigation_view"/>

</android.support.v4.widget.DrawerLayout>

navigation_view.xml

<merge xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:itemIconTint="@drawable/drawer_item"
        app:itemTextColor="@drawable/drawer_item"
        />

</merge>

drawer_item.xml (Kudos to Abhinav Gupta for this part)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/primary" android:state_checked="true" />
    <item android:color="@color/text" />
</selector>

Answer 2

I have also have that issue but I have found that solution may be it will work for you :-

 <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_home"
        app:itemBackground="@android:color/transparent"
        app:itemIconTint="@drawable/drawer_item"
        app:itemTextColor="@drawable/drawer_item"
        app:menu="@menu/activity_home_drawer" />

and drawer_item.xml:-

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/colorPrimaryDark" android:state_checked="true" />
    <item android:color="#000000" />
</selector>

nav_header_home.xml is:-

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="@dimen/nav_header_height"
    android:background="#000"
    android:gravity="bottom"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/nav_header_vertical_spacing"
        app:srcCompat="@drawable/user"
        tools:ignore="VectorDrawableCompat" />

    <LinearLayout
        android:id="@+id/llLogin"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/tvSignIn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginLeft="4dp"
            android:layout_marginRight="4dp"
            android:text="Sign In"
            android:textAppearance="@style/TextAppearance.AppCompat.Body1"
            android:textColor="#fff"
            android:textSize="16sp"
            android:textStyle="bold" />

        <View
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:background="#fff" />

        <TextView
            android:id="@+id/tvJoin"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginLeft="4dp"
            android:layout_marginRight="4dp"
            android:text="Join Free"
            android:textColor="#fff"
            android:textSize="16sp"
            android:textStyle="bold" />
    </LinearLayout>
</LinearLayout>