Navigation View's selectors behave incorrectly

问题:

I'm following this color scheme of Navigation View.

I created 3 selectors, for background, text and icon. When I set the selectors, my navigation view looked like this:

The problem is that no item is shown selected and if I press one item, all items' background color changes to gray. Icon never gets the primary color.

Here is are the XMLs:

 <android.support.design.widget.NavigationView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:background="@android:color/white"
            app:itemTextColor="@drawable/nav_item_text"
            app:itemIconTint="@drawable/nav_item_icon_tint"
            app:itemBackground="@drawable/nav_item_background"
            app:headerLayout="@layout/drawer_student_data_header"
            app:menu="@menu/drawer"
            android:id="@+id/navigationView"/>

nav_item_icon_tint.xml

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

nav_item_text.xml

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

nav_item_background.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@color/gray_400"/>
    <item android:state_selected="true" android:drawable="@color/gray_200" />
    <item android:drawable="@android:color/white" />
</selector>

回答1:

I've had a similar problem and looks like the way to solve it is to use android:state_checked instead of the android:state_selected in all three selectors (at least that solved it for me).

回答2:

You can use setItemTextColor and setItemIconTintList for set text color tint and icon color tint to item of NavigationDrawer,

To use this methods add this code to end of onCreateView:

 int[][] states = new int[][]{
        new int[]{-android.R.attr.state_checked},// unchecked state
        new int[]{android.R.attr.state_checked}, // checked state
};

int[] colors = new int[]{
        ContextCompat.getColor(this, R.color.colorPrimary),
        ContextCompat.getColor(this, R.color.colorPrimaryDark)
};

ColorStateList colorStateList = new ColorStateList(states, colors);
navigationView.setItemTextColor(colorStateList);
navigationView.setItemIconTintList(colorStateList);

This code set color to unchecked state and checked state. You can set color to other states.

Color array and state array should be have equals member count. You can select color whatever you want. You can use Color class or like the sample use resource. In this link you can find list of available states developer.android.

回答3:

Make sure you are not accessing the menu item from bottom navigation and setting its state to 'checked' twice. To avoid that, use:

mBottomNavigationView.selectedItemId(R.id.your_menu_item_id);

instead of

mBottomNavigationView.menu.getItem(position).setChecked(true);