Navigation Drawer menu items selected within different groups

Question

I have a working Navigation Drawer and having some issues with menuItem.setChecked(true); when using groups and headers within the menu. It's not highlighting menu items as expected.

Here is my XML:

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

    <group android:checkableBehavior="single">


        <item
            android:id="@+id/nav_welcome"
            android:icon="@drawable/abc_btn_check_to_on_mtrl_000"
            android:title="Welcome" />
        <item
            android:id="@+id/nav_map_showmap"
            android:icon="@mipmap/ic_map_black_24dp"
            android:title="Show Map" />
        <item
            android:icon="@mipmap/ic_list_black_24dp"
            android:title="Show List" />

        <item android:title="Settings">
            <menu>

                <item
                    android:id="@+id/nav_database_check"
                    android:icon="@mipmap/ic_cloud_done_black_24dp"
                    android:title="Update Database" />
                <item
                    android:id="@+id/nav_map_settings"
                    android:icon="@mipmap/ic_settings_black_24dp"
                    android:title="App Preferences" />

            </menu>
        </item>


        <item android:title="General">
            <menu>

                <item
                    android:id="@+id/nav_general_about"
                    android:icon="@mipmap/ic_info_black_24dp"
                    android:title="About" />
                <item
                    android:id="@+id/nav_general_help"
                    android:icon="@mipmap/ic_help_black_24dp"
                    android:title="Help" />
                <item
                    android:id="@+id/nav_general_report"
                    android:icon="@mipmap/ic_email_black_24dp"
                    android:title="Feedback / Report error" />
            </menu>
        </item>
    </group>
</menu>

As you can see I have 3 menu items, then a Settings Group with 2 menu items, then a General Group with 3 menu items.

Now with the first 3 menu items, the menuItem.setChecked(true); is working as expected, and highlighting that menu item. However, none of the following menu items within the subset ("Settings" or "General" subsets) are highlighting correctly.

I read that the <group android:checkableBehaviour="single"> can encapsulate the whole block, but that doesn't seem to be working.

Any thoughts? Cheers.

EDIT - Added Screenshot of the menu structure

Perhaps your issue is the same as [this one](http://stackoverflow.com/questions/30922012/i-am-unable-to-set-a-submenu-item-as-checked) and [this one](http://stackoverflow.com/questions/11592906/submenu-items-not-retaining-current-state) — BNK, Oct 02 '15 at 09:48
Try put "" below menus of Settings and General instead of the outside menu, as in the second link in my previous comment — BNK, Oct 02 '15 at 09:54
`However, none of the following menu items within the subset ("Settings" or "General" subsets) are highlighting correctly.` What are they doing? What are they supposed to do? — Eugen Pechanec, Oct 02 '15 at 10:19
Can you pl share your OnNavigationItemSelectedListener code? — Rajen Raiyarela, Oct 02 '15 at 10:22
From my original post, the correctly functioning items are the first 3 (Welcome, Show Map, Show List). When the other ones are clicked they simply do not highlight (one of the original 3 remains highlighted) — Jammo, Oct 02 '15 at 10:23

BNK · Answer 1 · 2015-10-06T21:47:11.050

UPDATE

If you have upgraded your Android Studio to 1.4, you can create a new project (with Navigation Drawer Activity template). Then, you can update your menu file as the following (pay attention to the two lines <group android:checkableBehavior="single"> inside 2 sub-menus at "Communicate" and "BNK"):

<?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>
            <group android:checkableBehavior="single">
                <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" />
            </group>
        </menu>
    </item>

    <item android:title="BNK">
        <menu>
            <group android:checkableBehavior="single">
                <item android:id="@+id/nav_share_bnk" android:icon="@android:drawable/ic_menu_share"
                    android:title="Share BNK" />
                <item android:id="@+id/nav_send_bnk" android:icon="@android:drawable/ic_menu_send"
                    android:title="Send BNK" />
            </group>
        </menu>
    </item>
</menu>

And here is the screenshot

END OF UPDATE

As I have commented, please try putting <group android:checkableBehavior="single"> below menus of Settings and General instead of putting below the outside menu. That means you will have 2 groups. Hope this helps!

I've tried that already, however, using multiple `` makes multiple selectable sections. So, they become hlighlighted, but then I have 3 sections which are individually highlightable (ie, 3 highlighted sections at the same time) — Jammo, Oct 02 '15 at 10:08
I think you can manually set the others not hightlighted by code — BNK, Oct 02 '15 at 10:16
In one of my projects, my navi drawer uses listview items instead of menu items, and I set highlight background with that logic, inside DrawerItemClickListener :-) — BNK, Oct 02 '15 at 10:18

score 6 · Answer 2 · answered Feb 25 '16 at 07:56

<group android:checkableBehavior="single">
    <item
        android:id="@+id/nav_vi_tri"
        android:icon="@drawable/ic_menu_camera"
        android:title="Vị trí" />
    <item
        android:id="@+id/nav_xem_lai"
        android:icon="@drawable/ic_menu_gallery"
        android:title="Xem lại hành trình" />
    <item
        android:id="@+id/nav_hinh_anh"
        android:icon="@drawable/ic_menu_slideshow"
        android:title="Hình ảnh" />

    <item android:title="Báo cáo">
        <menu>
            <group android:checkableBehavior="single">
                <item
                    android:id="@+id/nav_baocao1"
                    android:icon="@drawable/ic_menu_camera"
                    android:title="Hành trình xe chạy" />
                <item
                    android:id="@+id/nav_baocao2"
                    android:icon="@drawable/ic_menu_gallery"
                    android:title="Tốc độ của xe" />
                <item
                    android:id="@+id/nav_baocao3"
                    android:icon="@drawable/ic_menu_slideshow"
                    android:title="Quá tốc độ" />
                <item
                    android:id="@+id/nav_baocao4"
                    android:icon="@drawable/ic_menu_slideshow"
                    android:title="Thời gian lái" />
                <item
                    android:id="@+id/nav_baocao5"
                    android:icon="@drawable/ic_menu_slideshow"
                    android:title="Dừng đỗ" />
                <item
                    android:id="@+id/nav_baocao6"
                    android:icon="@drawable/ic_menu_slideshow"
                    android:title="Tổng hợp theo xe" />
                <item
                    android:id="@+id/nav_baocao7"
                    android:icon="@drawable/ic_menu_slideshow"
                    android:title="Quãng đường nhiên liệu" />
            </group>
        </menu>

    </item>

    <item android:title="Communicate">

        <menu>
            <group android:checkableBehavior="single">
                <item
                    android:id="@+id/nav_tien_ich"
                    android:icon="@drawable/ic_menu_share"
                    android:title="Tiện ích" />
                <item
                    android:id="@+id/nav_logout"
                    android:icon="@drawable/ic_menu_send"
                    android:title="Đăng xuất" />
            </group>
        </menu>

    </item>


</group>

it work for me :D

This worked for me as well, the missing part was a nested group with checkableBehavior="single". I figured there should only be one group, as maybe a sub-group would have its own checked item, but that was not the case. — Carvell Wakeman, Jul 10 '18 at 19:17

score 1 · Answer 3 · answered Sep 21 '15 at 13:18

Here you can use three different groups top , center and bottom. And first top group will have 3 menu items as you have . Then the center group can be same as your "Settings" menu with 2 items. And bottom group will have 2 items as it is in General.

And in your java file you can handle Item Selected Listener to handle the item click of the navigation menu.

// This method will trigger on item Click of navigation menu
        @Override
        public boolean onNavigationItemSelected(MenuItem p_menuItem) {

            //Checking if the item is in checked state or not, if not make it in checked state

            if(p_menuItem.getGroupId()==R.id.menu_top){
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_bottom,false,true);
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_center,false,true);
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_top,true,true);
            }
            else if(p_menuItem.getGroupId()==R.id.menu_center){
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_bottom,false,true);
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_center,true,true);
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_top,false,true);
            }
            else{
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_bottom,true,true);
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_center,false,true);
                m_navigationView.getMenu().setGroupCheckable(R.id.menu_top,false,true);
            }

            p_menuItem.setChecked(true);
            m_drawerLayout.closeDrawers();

That seems incredibly messy for a small UI thing that should be straight forward? Is there nothing wrong with my XML that is stopping the `setChecked()` from working correctly? — Jammo, Sep 21 '15 at 13:29

score 0 · Answer 4 · answered Oct 02 '15 at 10:29

Try this:

 private int selectedItem = 0; 

  private void setSelectedItem(MenuItem menuItem, int position) {

          mNavigationView.getMenu().getItem(selectedItem).setChecked(false);
          mNavigationView.getMenu().getItem(position).setChecked(true);

          if (menuItem.getGroupId() == R.id.group_2) {
                    mNavigationView.getMenu().setGroupCheckable(R.id.group_1, false, true);
                    mNavigationView.getMenu().setGroupCheckable(R.id.group_2, true, true);
                } else {
                    mNavigationView.getMenu().setGroupCheckable(R.id.group_1, true, true);
                    mNavigationView.getMenu().setGroupCheckable(R.id.group_2, false, true);
                }
                //Update highlighted item in the navigation menu
                menuItem.setChecked(true);
                selectedItem = position;
    }

Similar to a previous response. Seems messy doing this in code programatically, instead of relying on the behaviour of the XML ? — Jammo, Oct 02 '15 at 10:49

score 0 · Answer 5 · edited Feb 14 '16 at 12:46

Change the position on closing group tag </group> in your code as under:

Look the position carefully and do it.

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

    <group android:checkableBehavior="single">


        <item
            android:id="@+id/nav_welcome"
            android:icon="@drawable/abc_btn_check_to_on_mtrl_000"
            android:title="Welcome" />
        <item
            android:id="@+id/nav_map_showmap"
            android:icon="@mipmap/ic_map_black_24dp"
            android:title="Show Map" />
        <item
            android:icon="@mipmap/ic_list_black_24dp"
            android:title="Show List" />
    </group>

        <item android:title="Settings">
            <menu>

                <item
                    android:id="@+id/nav_database_check"
                    android:icon="@mipmap/ic_cloud_done_black_24dp"
                    android:title="Update Database" />
                <item
                    android:id="@+id/nav_map_settings"
                    android:icon="@mipmap/ic_settings_black_24dp"
                    android:title="App Preferences" />

            </menu>
        </item>


        <item android:title="General">
            <menu>

                <item
                    android:id="@+id/nav_general_about"
                    android:icon="@mipmap/ic_info_black_24dp"
                    android:title="About" />
                <item
                    android:id="@+id/nav_general_help"
                    android:icon="@mipmap/ic_help_black_24dp"
                    android:title="Help" />
                <item
                    android:id="@+id/nav_general_report"
                    android:icon="@mipmap/ic_email_black_24dp"
                    android:title="Feedback / Report error" />
            </menu>
        </item>
</menu>

Navigation Drawer menu items selected within different groups

5 Answers5

UPDATE

END OF UPDATE

Linked