Vivek Kumar
Vivek Kumar

Reputation: 1282

How to change color of text and icon of Sub-Menu attached to Navigation view?

I am trying to figure out how I can change color of sub-menu items which is actually attached to navigation view. Following codes are actually from default template of Navigation Drawer which is available in android studio.

activity_main_drawer.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/nav_camara"
            android:icon="@android:drawable/ic_menu_camera"
            android:title="Import"
            />
        <item
            android:id="@+id/nav_gallery"
            android:icon="@android:drawable/ic_menu_gallery"
            android:title="Gallery"/>
        <item
            android:id="@+id/nav_slideshow"
            android:icon="@android:drawable/ic_menu_slideshow"
            android:title="Slideshow"/>
        <item
            android:id="@+id/nav_manage"
            android:icon="@android:drawable/ic_menu_manage"
            android:title="Tools"/>
    </group>

    <item android:title="Communicate">
        <menu>
            <item
                android:id="@+id/nav_share"
                android:icon="@android:drawable/ic_menu_share"
                android:title="Share"/>
            <item
                android:id="@+id/nav_send"
                android:icon="@android:drawable/ic_menu_send"
                android:title="Send"/>
        </menu>
    </item>

</menu>

activity_main.xml

    <include
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <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"
        android:background="#512DA8"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer"
        app:itemTextColor="@drawable/nav_menu_item_color"
        app:itemIconTint="@drawable/nav_menu_item_color"/>

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

and I have a drawable file for click and normal color which is actualy used above. nav_menu_item_color.xml

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


</selector>

So, you can see result image as I attached below :-Color of Sub-Menu Items didn't change

Colors not working for sub menu, so, what I want to do is .. I want to change color of menu item "communicate" and sub-menu item "send" and "share" as it is working for root menu items

Upvotes: 6

Views: 6500

Answers (2)

yubaraj poudel
yubaraj poudel

Reputation: 3879

Changing the color of the header and Subheader in the Navigation View and paste the below code in your res>values>styles.xml

 <style name="NavigationViewStyle">
    <item name="android:textSize">16sp</item> <!-- menu item text size-->
    <item name="android:listPreferredItemHeightSmall">40dp</item><!-- menu item height-->
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">#FFB300</item>
</style>

NavigationView set the header color as textcolor secondary and subheader color as the textColor Primary .

finally, add this style in the navigationView

 <android.support.design.widget.NavigationView
    android:id="@+id/navview"
    android:layout_width="300dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:background="#022F56"
    app:headerLayout="@layout/sidebar_header"
    app:theme="@style/NavigationViewStyle"
    app:menu="@menu/sidebar_home"/>

And the output will be, enter image description here

Thats all, happy Coding.

Upvotes: 6

fractalwrench
fractalwrench

Reputation: 4076

Your submenu needs to be wrapped in a menu & group tag like below. This will allow you to select one of any of the menu items at a time. You can select them by setting the item as checked in your NavigationView.OnNavigationItemSelectedListener.

<?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/nav1"
            android:checked="true"
            android:icon="@drawable/myd1"
            android:title="Nav 1"
            />
    </group>
    <item android:title="@string/nav_item_subheading_app">
        <menu>
            <group android:checkableBehavior="single">
                <item
                    android:id="@+id/nav1"
                    android:icon="@drawable/myd1"
                    android:title="Nav 1"
                    />
            </group>
        </menu>
    </item>
</menu>

Upvotes: 4

Related Questions