Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing text color of menu item in navigation drawer

Tags:

android

xml

menu

I'm trying to add a night theme for my app and I've wasted nearly three hours just trying to make the text and icons in my navigation drawer turn white along with the dark background. Here is the way I'm trying to go about doing this in onCreate() in MainActivity.java:

navigationView = (NavigationView) findViewById(R.id.navigation_view); navigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {      // This method will trigger onItemClick of navigation menu     @Override     public boolean onNavigationItemSelected(MenuItem menuItem) {          // Checking if the item is in checked state or not, if not make it in checked state         if (menuItem.isChecked())             menuItem.setChecked(false);         else menuItem.setChecked(true);          if (nightMode == 0) {             SpannableString spanString = new SpannableString(menuItem.getTitle().toString());             spanString.setSpan(new ForegroundColorSpan(Color.WHITE), 0, spanString.length(), 0); // fix the color to white             menuItem.setTitle(spanString);         } 

The nightMode boolean is irrelevant because it works. When night mode is set to on (0), whatever menu item is selected in the navigation drawer turns white. However, that only happens when each item is selected which is obviously inconvenient. Here is my drawer_dark.xml:

    <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android">     <group         android:checkableBehavior="single">         <item             android:id="@+id/unitone"             android:checked="true"             android:icon="@drawable/one_white"             android:title="Classical Period" />         <item             android:id="@+id/unittwo"             android:checked="false"             android:icon="@drawable/two_white"             android:title="Postclassical Period" />         <item             android:id="@+id/unitthree"             android:checked="false"             android:icon="@drawable/three_white"             android:title="Early Modern Era" />         <item             android:id="@+id/unitfour"             android:checked="false"             android:icon="@drawable/four_white"             android:title="Dawn of Industrial Age" />         <item             android:id="@+id/unitfive"             android:checked="false"             android:icon="@drawable/five_white"             android:title="Modern Era" />     </group> </menu> 

I'm using white icons on a transparent background for each item, yet they show up as black on the black background of the navigation drawer. I've tried looking for an xml solution to changing the color of the text and I'm scratching my head because I don't know why this was overlooked.

Can someone offer me a dynamic solution in getting what I'm trying to achieve? All help is appreciated, thank you!

EDIT: I am not using a third party library, it's the NavigationView provided in the support library. Here's the XML layout:

<android.support.v4.widget.DrawerLayout     xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     xmlns:app="http://schemas.android.com/apk/res-auto"     android:id="@+id/drawer"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:elevation="7dp"     tools:context=".MainActivity"     android:fitsSystemWindows="true" >      <FrameLayout         android:layout_width="match_parent"         android:layout_height="match_parent"         android:orientation="vertical">          <FrameLayout             android:id="@+id/container"             android:layout_width="match_parent"             android:layout_height="match_parent"             android:background="@color/ColorDark" />          <include layout="@layout/toolbar" />      </FrameLayout>      <android.support.design.widget.NavigationView         android:id="@+id/navigation_view"         android:background="#000"         android:layout_height="match_parent"         android:layout_width="match_parent"         android:layout_gravity="start"         app:headerLayout="@layout/header"         app:menu="@menu/drawer" />  </android.support.v4.widget.DrawerLayout> 
like image 880
wasimsandhu Avatar asked Aug 17 '15 04:08

wasimsandhu


People also ask

How do I change the navigation drawer item color?

Open res > values > colors. xml and add the following line for the new icon and text color for when an item is selected: 5. In your styles.

How do I customize my navigation drawer?

Step 1 − Create a new project in Android Studio, go to File ⇒ New Project and fill all required details to create a new project. Step 2 − Add the following code to res/layout/activity_main. xml. Step 3 − Add the following code to res/layout/nav_header_main.

What is NavigationView in Android?

com.google.android.material.navigation.NavigationView. Represents a standard navigation menu for application. The menu contents can be populated by a menu resource file. NavigationView is typically placed inside a DrawerLayout .

What is menu drawer?

by Velmurugan March 10, 2021. The navigation drawer is used to navigate many screens or functionalities of the app by clicking on the 'hamburger' icon. Swiping from the left is also a way to bring the drawer into view, a screen then slides in, showing many items.


1 Answers

 <android.support.design.widget.NavigationView         android:id="@+id/navigation_view"         android:background="#000"         android:layout_height="match_parent"         android:layout_width="match_parent"         android:layout_gravity="start"         app:headerLayout="@layout/header"         app:itemTextColor="your color"         app:menu="@menu/drawer" /> 
like image 106
Neha Tyagi Avatar answered Sep 28 '22 13:09

Neha Tyagi