Zmień kolor zaznaczonej pozycji menu w szufladzie nawigacji

Korzystam z nowej biblioteki Android Design Support, aby zaimplementować szufladę nawigacji w mojej aplikacji.

Nie mogę wymyślić, jak zmienić kolor wybranej pozycji!

Oto XML menu:

<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
    <item
        android:id="@+id/navigation_item_1"
        android:icon="@drawable/ic_1"
        android:title="@string/navigation_item_1"/>

    <item
        android:id="@+id/navigation_item_2"
        android:icon="@drawable/ic_2"
        android:title="@string/navigation_item_2"/>
</group>

A oto plik navigationview xml, który znajduje się wewnątrz android.support.v4.widget.DrawerLayout:

<android.support.design.widget.NavigationView
    android:id="@+id/activity_main_navigationview"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:headerLayout="@layout/drawer_header"
    app:itemIconTint="@color/black"
    app:itemTextColor="@color/primary_text"
    app:menu="@menu/menu_drawer">

    <TextView
        android:id="@+id/main_activity_version"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginBottom="@dimen/activity_vertical_margin"
        android:layout_marginLeft="@dimen/activity_horizontal_margin"
        android:textColor="@color/primary_text" />

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

Dziękuję za pomoc!

[EDYTUJ] Spojrzałem już na rozwiązania takie jak to: Zmień kolor tła menu Androida .

Wydaje się, że to niezły hack i pomyślałem, że dzięki nowej bibliotece Design Support Library zostanie wprowadzone coś czystszego?

Cóż, możesz to osiągnąć za pomocą zasobu stanu koloru . Jeśli zauważysz, że w środku NavigationViewużywasz

app:itemIconTint="@color/black"
app:itemTextColor="@color/primary_text"

Tutaj zamiast używać @color/blacklub @color/primary_test, użyj pliku Color State List Resource. W tym celu najpierw utwórz nowy xml(np. Drawer_item.xml) wewnątrz colorkatalogu (który powinien znajdować się w reskatalogu). Jeśli nie masz jeszcze nazwanego katalogu color, utwórz go.

Teraz w środku drawer_item.xmlzrób coś takiego

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="checked state color" android:state_checked="true" />
    <item android:color="your default color" />
</selector>

Ostatnim krokiem byłaby zmiana NavigationView

<android.support.design.widget.NavigationView
    android:id="@+id/activity_main_navigationview"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    app:headerLayout="@layout/drawer_header"
    app:itemIconTint="@color/drawer_item"  // notice here
    app:itemTextColor="@color/drawer_item" // and here
    app:itemBackground="@android:color/transparent"// and here for setting the background color to tranparent
    app:menu="@menu/menu_drawer">

Jak to można użyć oddzielnych Kolor Stan List Zasoby dla IconTint, ItemTextColor, ItemBackground.

Teraz, gdy ustawisz element jako zaznaczony (w trybie xmllub programowo), określony element będzie miał inny kolor niż elementy niezaznaczone.

Myślę, że app:itemBackgroundoczekuje rysowalnego. Więc wykonaj poniższe czynności:

Utwórz plik do rysowania highlight_color.xmlz następującą zawartością:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
     <solid android:color="YOUR HIGHLIGHT COLOR"/>
</shape>

Utwórz kolejny plik do rysowania nav_item_drawable.xmlz następującą zawartością:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/highlight_color" android:state_checked="true"/>
</selector>

Na koniec dodaj app:itemBackgroundtag w NavView:

<android.support.design.widget.NavigationView
android:id="@+id/activity_main_navigationview"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/drawer_header"
app:itemIconTint="@color/black"
app:itemTextColor="@color/primary_text"
app:itemBackground="@drawable/nav_item_drawable"
app:menu="@menu/menu_drawer">

tutaj plik highlight_color.xml definiuje jednolity kolor, który można narysować jako tło. Później ten kolor do rysowania jest przypisany do selektora nav_item_drawable.xml.

To zadziałało dla mnie. Mam nadzieję, że to pomoże.

********************************************** AKTUALIZACJA *** *******************************************

Chociaż powyższa odpowiedź daje ci dobrą kontrolę nad niektórymi właściwościami, ale sposób, w jaki mam zamiar opisać, wydaje się bardziej SOLIDNY i nieco chłodniejszy .

Możesz więc zdefiniować ThemeOverlay w styles.xmlwidoku NavigationView w następujący sposób:

    <style name="ThemeOverlay.AppCompat.navTheme">

        <!-- Color of text and icon when SELECTED -->
        <item name="colorPrimary">@color/color_of_your_choice</item> 

        <!-- Background color when SELECTED -->
        <item name="colorControlHighlight">@color/color_of_your_choice</item> 

    </style>

teraz zastosuj to ThemeOverlay do app:themeatrybutu NavigationView, na przykład:

<android.support.design.widget.NavigationView
android:id="@+id/activity_main_navigationview"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:theme="@style/ThemeOverlay.AppCompat.navTheme"
app:headerLayout="@layout/drawer_header"
app:menu="@menu/menu_drawer">

Mam nadzieję, że to pomoże.

Należy ustawić NavigateItemzaznaczone na true po każdym NavigateViewkliknięciu elementu

//listen for navigation events
NavigationView navigationView = (NavigationView)findViewById(R.id.navigation);
navigationView.setNavigationItemSelectedListener(this);
// select the correct nav menu item
navigationView.getMenu().findItem(mNavItemId).setChecked(true);

Dodaj NavigationItemSelectedListenernaNavigationView

  @Override
  public boolean onNavigationItemSelected(final MenuItem menuItem) {
    // update highlighted item in the navigation menu
    menuItem.setChecked(true);
    mNavItemId = menuItem.getItemId();

    // allow some time after closing the drawer before performing real navigation
    // so the user can see what is happening
    mDrawerLayout.closeDrawer(GravityCompat.START);
    mDrawerActionHandler.postDelayed(new Runnable() {
      @Override
      public void run() {
        navigate(menuItem.getItemId());
      }
    }, DRAWER_CLOSE_DELAY_MS);
    return true;
  }

Oto inny sposób, aby to osiągnąć:

public boolean onOptionsItemSelected(MenuItem item) {

    int id = item.getItemId();

    item.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
        @Override
        public boolean onMenuItemClick(MenuItem item) {
            item.setEnabled(true);
            item.setTitle(Html.fromHtml("<font color='#ff3824'>Settings</font>"));
            return false;
            }
        });


    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}

}

Oto, jak możesz to zrobić w metodzie onCreate swojej aktywności:

NavigationView navigationView = findViewById(R.id.nav_view);
ColorStateList csl = new ColorStateList(
    new int[][] {
        new int[] {-android.R.attr.state_checked}, // unchecked
        new int[] { android.R.attr.state_checked}  // checked
    },
    new int[] {
        Color.BLACK,
        Color.RED
    }
);
navigationView.setItemTextColor(csl);
navigationView.setItemIconTintList(csl);

Krok 1: Zbuduj zaznaczony / niezaznaczony selektor:

selector.xml

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

Krok 2: użyj atrybutu xml app:itemTextColorw NavigationViewwidgecie, aby wybrać kolor tekstu.

<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:headerLayout="@layout/navigation_header_layout"
    app:itemTextColor="@drawable/selector"
    app:menu="@menu/navigation_menu" />

Krok 3:
Z jakiegoś powodu, gdy trafisz na element z NavigationViewmenu, nie uważa tego za sprawdzenie przycisku. Musisz więc ręcznie sprawdzić wybrany element i wyczyścić poprzednio wybrany element. Użyj poniższego listenera, aby to zrobić

@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {

    int id = item.getItemId();

    // remove all colors of the items to the `unchecked` state of the selector
    removeColor(mNavigationView);

    // check the selected item to change its color set by the `checked` state of the selector
    item.setChecked(true);

    switch (item.getItemId()) {
      case R.id.dashboard:
          ...
    }

    drawerLayout.closeDrawer(GravityCompat.START);
    return true;
}

private void removeColor(NavigationView view) {
    for (int i = 0; i < view.getMenu().size(); i++) {
        MenuItem item = view.getMenu().getItem(i);
        item.setChecked(false);
    }
}

Krok 4:
Aby zmienić kolor ikony, użyj app:iconTintatrybutu w NavigationViewpozycjach menu i ustaw ten sam selektor.

<?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/nav_account"
        android:checked="true"
        android:icon="@drawable/ic_person_black_24dp"
        android:title="My Account"
        app:iconTint="@drawable/selector" />
    <item
        android:id="@+id/nav_settings"
        android:icon="@drawable/ic_settings_black_24dp"
        android:title="Settings"
        app:iconTint="@drawable/selector" />

    <item
        android:id="@+id/nav_logout"
        android:icon="@drawable/logout"
        android:title="Log Out"
        app:iconTint="@drawable/selector" />
</menu>

Wynik: