How to add one section separator for Navigation Drawer in Android? How to add one section separator for Navigation Drawer in Android? android android

How to add one section separator for Navigation Drawer in Android?


Make sure you define each group with a unique ID, separator won't appear without the ID.

For example, this is my drawer_menu.xml:

<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android">    <group        android:id="@+id/menu_top"        android:checkableBehavior="single">        <item            android:checked="true"            android:id="@+id/drawer_item_timeline"            android:icon="@drawable/ic_timer_grey600_24dp"            android:title="@string/drawer_timeline"/>        <item            android:id="@+id/drawer_item_reports"            android:icon="@drawable/ic_timetable_grey600_24dp"            android:title="@string/drawer_reports"/>    </group>    <group        android:id="@+id/menu_bottom"        android:checkableBehavior="none">        <item            android:id="@+id/drawer_item_settings"            android:icon="@drawable/ic_settings_black_24dp"            android:title="@string/drawer_settings" >        </item>    </group></menu>

Sample drawer

Gabriel adds below in the comments that if the group doesn't have an id, the separator will not appear.


To separate menu items by a divider line, only group items with a unique id like following example:

activity_main_drawer.xml:

<?xml version="1.0" encoding="utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    tools:showIn="navigation_view">    <item        android:id="@+id/nav_apps_and_games"        android:icon="@drawable/ic_apps_black_24dp"        android:title="@string/my_apps_and_games" />    <item        android:id="@+id/nav_bookmarked_apps"        android:icon="@drawable/ic_add_bookmark_black_24dp"        android:title="@string/bookmarked_apps" />    <item        android:id="@+id/nav_manage_downloads"        android:icon="@drawable/ic_downloading_file_black_24dp"        android:title="@string/manage_downloads" />    <!-- SET A UNIQUE ID TO THE BELOW GROUP -->    <group android:id="@+id/group1">        <item            android:id="@+id/nav_settings"            android:icon="@drawable/ic_settings_black_24dp"            android:title="@string/settings" />        <item            android:id="@+id/nav_sign_up"            android:icon="@drawable/ic_card_membership_black_24dp"            android:title="@string/sign_up_login" />    </group></menu>

Visual Result:

enter image description here


My hacky method is similar to Mostrapotski's.

In my Layout for my custom adapter, I'm adding a horizontal separator at the beginning of each item and setting it's visibility to gone.

For the elements that mark the beginning of a new group, I set their visibility to visible so that the separator shows up on top of it.