Wie kann ich den Hintergrund des Elements und die Farbe des Elementtextes in NavigationView anpassen?

Ich möchte so etwas erreichen, wie in den Material Design Docs gezeigt .

colorControlHighlight wird für den Hintergrund für markierte Elemente verwendet.

Ich muss anpassen:

• Hintergrund deaktiviert
• Textfarbe geprüft
• Textfarbe deaktiviert

Mit der MaterialComponents Library können Sie folgende Attribute verwenden:

• app:itemShapeFillColor: Hintergrundfarbe
• app:itemIconTint: Symboltönung
• app:itemTextColor: Textfarbe

Im Layout:

<com.google.android.material.navigation.NavigationView
    app:itemShapeFillColor="@color/shape_selector"
    app:itemIconTint="@color/icon_tint_selector"
    app:itemTextColor="@color/text_color_selector"
    ../>

In einem benutzerdefinierten Stil:

<style name="..." parent="Widget.MaterialComponents.NavigationView" >
   <item name="itemShapeFillColor">@color/shape_selector</item>
   <item name="itemIconTint">@color/icon_tint_selector</item>
   <item name="itemTextColor">@color/text_color_selector</item>
</style>

Für das itemIconTintund können itemTextColorSie einen Selektor wie folgt verwenden:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color="?attr/colorPrimary" android:state_checked="true"/>
  <item android:alpha="0.38" android:color="?attr/colorOnSurface" android:state_enabled="false"/>
  <item android:color="?attr/colorOnSurface"/>
</selector>

Für die können itemShapeFillColorSie einen Selektor verwenden wie:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:alpha="0.12" android:color="?attr/colorPrimary" android:state_activated="true"/>
  <item android:alpha="0.12" android:color="?attr/colorPrimary" android:state_checked="true"/>
  <item android:color="@android:color/transparent"/>
</selector>

Nur eine letzte Anmerkung . Achten Sie auf die Verwendung der itemBackground.
Es ist so eingestellt, @nulldass ein geformter Hintergrund verwendet wird, der programmgesteuert generiert wird, NavigationViewwenn itemShapeAppearanceund / oder festgelegt itemShapeAppearanceOverlayist ( Standardverhalten ).
Dieser Hintergrund wird anhand der itemShape*Attribute gestaltet.
Durch die Einstellung itemBackgroundwird der programmatische Hintergrund überschrieben und die in den itemShape * -Attributen festgelegten Werte werden ignoriert.

itemBackground, itemIconTintUnd itemTextColorsind einfache XML-Attribute , die eingestellt werden können, wenn Sie anstelle des einen benutzerdefinierten Präfix verwenden müssen android:ein.

Beispiel

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

    <!-- Other layout views -->

    <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:itemBackground="@drawable/my_ripple"
        app:itemIconTint="#2196f3"
        app:itemTextColor="#009688"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/drawer_view" />

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

Hinweis: In diesem Fall sind Textfarbe, Symboltönung und Hintergrund statisch. Wenn Sie die Farbe des Textes ändern möchten (z. B. rosa, wenn nicht markiert, und blaugrün, wenn aktiviert), sollten Sie a verwenden ColorStateList.

Beispiel

Erstellen Sie eine neue * .xml-Datei in /res/color- nennen wir sie state_list.xml - mit folgendem Inhalt:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- This is used when the Navigation Item is checked -->
    <item android:color="#009688" android:state_checked="true" />
    <!-- This is the default text color -->
    <item android:color="#E91E63" />
</selector>

und dann einfach so referenzieren: app:itemTextColor="@color/state_list"

Das gilt auch für itemIconTint. itemBackgrounderwartet eine Ressourcen-ID. Siehe auch die Dokumente .

NavigationDrawer (NavigationView) bietet drei Optionen für die Konfiguration von markierten / ausgewählten Elementen.

app:itemIconTint="@color/menu_text_color" //icon color
app:itemTextColor="@color/menu_text_color" //text color
app:itemBackground="@drawable/menu_background_color" //background

Symbol- und Textfarbe

Die ersten beiden Optionen (Symbol und Text) benötigen eine Ressource für die Farbstatusliste - https://developer.android.com/guide/topics/resources/color-list-resource.html .

Diese menu_text_colorRessource muss in res / color erstellt werden . Dieser Dateiinhalt sollte ungefähr so ​​aussehen:

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

• @color/colorWhite - Farbressource für markiertes Element

• @color/colorBlack - Farbressource für ungeprüftes Element

Ich habe eine Ressource für beide erstellt, aber es ist möglich, zwei getrennte Dateien zu erstellen - eine für Text und eine für das Symbol.

Hintergrund (itemBackground)

Die Hintergrundoption benötigt eine zeichnbare Ressource anstelle einer Farbe. Jeder Versuch, die Farbe festzulegen, endet ausnahmsweise. Zeichnungsfähige Ressourcen müssen in res / drawable erstellt werden und ihr Inhalt sollte folgendermaßen aussehen:

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

Es ist nicht erforderlich, Zeichen zu erstellen, die Farbe simulieren (in anderen Lösungen habe ich solche Vorschläge gesehen - möglicherweise für ältere SDK-Versionen). Farbe kann direkt in dieser Datei verwendet werden. In dieser Beispieldatei verwende ich eine transparente Farbe für nicht geprüftes Element und colorPrimaryfür geprüftes Element.

Fehlerbehebung und wichtige Hinweise

• Verwenden Sie in der Hintergrundressource immer state_checked = "false" anstelle von default. Mit der Standardfarbe funktioniert dies nicht
• Denken Sie bei dynamisch / programmgesteuert erstellten Menüs daran, Elemente als überprüfbar festzulegen :

Codebeispiel (dynamischer Menüpunkt hinzufügen):

  menu.add(group_id, item_id, Menu.NONE, item_name).setCheckable(true).setChecked(false);

Wenn Elemente nicht als überprüfbar festgelegt werden, funktioniert der Hintergrund nicht (überraschende Text- und Symbolfarben funktionieren wie erwartet).

Die Verwendung von colorControlHighlight ist für mich eine gute Lösung. Beachten Sie, dass Sie mit der neuesten Support-Bibliothek für jedes Widget ein Thema (nicht nur den Stil) definieren können. Sie können beispielsweise colorControlHighlight im NavigationView-Design definieren. Dies wird nicht auf die übrigen Widgets angewendet.

Wenn Sie nur eine Menüelementfarbe aus Ihrer Aktivität basierend auf Ereignissen ändern möchten, lesen Sie diesen Blog von HANIHASHEMI:

https://hanihashemi.com/2017/05/06/change-text-color-of-menuitem-in-navigation-drawer/

private void setTextColorForMenuItem(MenuItem menuItem, @ColorRes int color) {
  SpannableString spanString = new SpannableString(menuItem.getTitle().toString());
  spanString.setSpan(new ForegroundColorSpan(ContextCompat.getColor(this, color)), 0, spanString.length(), 0);
  menuItem.setTitle(spanString);
}

Methode aufrufen

setTextColorForMenuItem(item, R.color.colorPrimary);

Wenn Sie mit Xamarin Android arbeiten, versuchen Sie Folgendes:

private void SetTextColorForMenuItem(IMenuItem menuItem, Android.Graphics.Color color)
        {
            SpannableString spanString = new SpannableString(menuItem.TitleFormatted.ToString());
            spanString.SetSpan(new ForegroundColorSpan(color), 0, spanString.Length(), 0);
            menuItem.SetTitle(spanString);
        }

Aufrufmethode:

SetTextColorForMenuItem(navigationView.Menu.GetItem(0), Android.Graphics.Color.OrangeRed);

Sie können diesen Code programmgesteuert verwenden:

int[][] states = new int[][] {
    new int[] { android.R.attr.state_enabled}, // enabled
    new int[] {-android.R.attr.state_enabled}, // disabled
    new int[] {-android.R.attr.state_checked}, // unchecked
    new int[] { android.R.attr.state_pressed}  // pressed
};

int[] colors = new int[] {
    Color.BLACK,
    Color.RED,
    Color.GREEN,
    Color.BLUE
};

ColorStateList myList = new ColorStateList(states, colors);

  nav_view.setItemIconTintList(myList);

In der Navigationsansicht können Sie jetzt auch Ihre eigene Elementansicht bereitstellen. Mit neu appcompat-v7:23.1.0kannst du

Festlegen benutzerdefinierter Ansichten für Elemente über die App: actionLayout oder mithilfe von MenuItemCompat.setActionView ().

View view = View.inflate(context, R.layout.your_custom_nav_layout_item, null);
MenuItemCompat.setActionView(menuItem, view); 

Auf diese Weise können Sie mit TextView Ihr eigenes Layout erstellen und nach Belieben ändern backgrounds/colors/fonts. Hoffe das war hilfreich :) Quelle

Wenn Sie dies programmgesteuert tun möchten:

Basierend auf Jhons Antwort:

Sie können die Kotlin-Erweiterung folgendermaßen verwenden:

fun NavigationView.setTextColorForMenuItems(@ColorInt color: Int) {
    for (i: Int in 0 until menu.size()) {
        val menuItem = menu.getItem(i)
        val spanString = SpannableString(menuItem.title.toString())
        spanString.setSpan(ForegroundColorSpan(color), 0, spanString.length, 0)
        menuItem.title = spanString
    }
}

Dann ruf an

nav_view.setTextColorForMenuItems(Color.BLACK)

Sie können dies mit der folgenden Anweisung tun:

navigationView.setItemBackground(ContextCompat.getDrawable(CustomerHomeActivity.this, R.color.transparent));