How to add a collapsible menu item inside navigation drawer in android?

Kanwarbir Singh picture Kanwarbir Singh · Mar 12, 2016 · Viewed 35.7k times · Source

I have a DrawerLayout enclosing a NavigationView and this layout activity serves as a common Navigation drawer for all the activities in my app. I am providing the menu resource for app:menu in navigation view. I have some menu items, but I want one menu item to be collapsible/expandable, so that when I click on it, it expands to show two submenus and collapses again on a second click.

I have added submenus by adding another <menu> inside the <item> but cant make it collapsible/expandable.

Additionally, I don't want to use ExpandableListView for my purpose. Instead, I just need to do some tweaks in menu resource file. Please just point me in the correct direction. I have searched Google only to find code, blogs, and examples for collapsible list items using ExpandableListView, but I need it to work with the NavigationView design widget from the design support Library.

Here's my code for the menu file:

<menu xmlns:android="http://schemas.android.com/apk/res/android">

<group android:checkableBehavior="single">
    <item
        android:id="@+id/nav_aboutus"
        android:title="About Us" />

    <item
        android:id="@+id/nav_faq"
        android:title="FAQs" />
    <item
        android:id="@+id/nav_share"
        android:title="Share" />
    <item
        android:id="@+id/nav_myaccount"
        android:title="My Account" />
    <item
        android:id="@+id/nav_legal"
        android:title="Legal" >
        <menu>
                <item
                    android:id="@+id/nav_tnc"
                    android:title="Terms and Conditions" />
                <item
                    android:id="@+id/nav_pp"
                    android:title="Privacy Policy" />
            </group>
        </menu>
    </item>

</menu>

I want Legal menu item to be expandable having two submenu items 'Terms and Conditions', 'Privacy Policy'.

Answer

arslan picture arslan · Apr 6, 2017

there is a trick to do this without using ExpandableListView.Add those menu items normally in menu layout file and hide/show them on item click of menu item under which you want to show them like this:

 public boolean onNavigationItemSelected(MenuItem item) {
        // Handle navigation view item clicks here.

        NavigationView nv= (NavigationView) findViewById(R.id.nav_view);
        Menu m=nv.getMenu();
        int id = item.getItemId();
        if (id == R.id.nav_posts) {
            boolean b=!m.findItem(R.id.nav_class).isVisible();
            //setting submenus visible state
            m.findItem(R.id.nav_class).setVisible(b);
            m.findItem(R.id.nav_dept).setVisible(b);
            m.findItem(R.id.nav_batch).setVisible(b);
            m.findItem(R.id.nav_campus).setVisible(b);
            return true;
        } else if (id == R.id.nav_walls) {
            boolean b=!m.findItem(R.id.nav_wall_events).isVisible();
            //setting submenus visible state
            m.findItem(R.id.nav_wall_events).setVisible(b);
            m.findItem(R.id.nav_wall_fun).setVisible(b);
            m.findItem(R.id.nav_wall_hadith).setVisible(b);
            m.findItem(R.id.nav_wall_news).setVisible(b);
            m.findItem(R.id.nav_wall_Poetry).setVisible(b);
            return true;
        } else if (id == R.id.nav_com) {

            m.findItem(R.id.nav_share).setVisible(false);
            m.findItem(R.id.nav_send).setVisible(false);

        } else if (id == R.id.nav_share) {

        } else if (id == R.id.nav_send) {

        }
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }

where menu layout file is:

<?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_posts"
            android:icon="@drawable/ic_menu_camera"
            android:title="Posts" />

        <item
            android:id="@+id/nav_class"
            android:title="Class"
            android:visible="false" />
        <item
            android:id="@+id/nav_dept"
            android:title="Department"
            android:visible="false" />
        <item
            android:id="@+id/nav_batch"
            android:title="Batch"
            android:visible="false" />
        <item
            android:id="@+id/nav_campus"
            android:title="Campus"
            android:visible="false" />


        <item
            android:id="@+id/nav_walls"
            android:icon="@drawable/ic_menu_gallery"
            android:title="Walls" />

        <item
            android:id="@+id/nav_wall_news"
            android:title="News"
            android:visible="false" />
        <item
            android:id="@+id/nav_wall_events"
            android:title="Events"
            android:visible="false" />
        <item
            android:id="@+id/nav_wall_fun"
            android:title="Fun"
            android:visible="false" />
        <item
            android:id="@+id/nav_wall_hadith"
            android:title="Hadith"
            android:visible="false" />
        <item
            android:id="@+id/nav_wall_Poetry"
            android:title="Poetry"
            android:visible="false" />


    </group>

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

</menu>