1

I need to add a separator between Navigation Drawer menu items.

Code for NavigationDrawer

<android.support.design.widget.NavigationView
   android:id="@+id/navigationView"
   android:layout_width="wrap_content"
   android:layout_height="match_parent"
   android:layout_gravity="start"
   android:background="@color/colorPrimary"
   android:fitsSystemWindows="true"
   android:theme="@style/NavigationTheme"
   custom:headerLayout="@layout/drawer_header"
   custom:menu="@menu/drawer_view" />

drawer_view.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_home"
        android:icon="@drawable/com_mixpanel_android_ic_bell"
        android:title="@string/home" />
    <item> </item>
    .....
    </group>
</menu>

Theme

 <style name="NavigationTheme" parent="ThemeOverlay.AppCompat.Dark">
    <item name="colorControlHighlight">@color/colorAccent</item>
</style>

Screenshot of navigation drawer

How can I add a separator (View) between two menu_items?

Damian Kozlak
  • 7,065
  • 10
  • 45
  • 51
Prerna Rawat
  • 151
  • 1
  • 12
  • 4
    see this answer http://stackoverflow.com/questions/30625280/how-to-create-a-simple-divider-in-the-new-navigationview/30625471#30625471 – N J Dec 30 '15 at 13:23

1 Answers1

4

Solution is simple - Separate items into different groups (groups must have assigned different, unique id's).

<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <group 
        android:id="@+id/group1"
        android:checkableBehavior="single">
    <item>(...)</item>
    </group>

    <group 
        android:id="@+id/group2"
        android:checkableBehavior="single">
    <item>(...)</item>
    </group>
</menu>

Edit:

In your situation, when you need to remove this padding, there are two solutions:

  1. Don't use custom:menu, create ListView instead with adapter and set for your ListView and add 

    android:divider="#FFFFFF"
android:dividerHeight="1px"

  2. This solution may not work, because parameters can be changed by Android Platform Developers:

    Add the following lines to dimens.xml

    <dimen name="design_navigation_padding_top_default" tools:override="true">0dp</dimen>
<dimen name="design_navigation_separator_vertical_padding" tools:override="true">0dp</dimen>
<dimen name="design_navigation_padding_bottom" tools:override="true">0dp</dimen>

    or

    <dimen name="navigation_separator_vertical_padding">0dp</dimen>
Damian Kozlak
  • 7,065
  • 10
  • 45
  • 51
  • Thanks for your answer but it is taking too much spaces. As you can see the highlighted area is not even filled with whole red color. Any hint how can I correct it. http://i.imgur.com/eOmEQgG.png – Prerna Rawat Dec 30 '15 at 13:36
  • Then there are two options. First one is create `ListView` and adapter for it, instead of menu. Second is easier, but may not work - add to `dimens.xml` following line `0dp`. – Damian Kozlak Dec 30 '15 at 13:42
  • Yeah I used ListView :) BTW adding `navigation_separator_vertical_padding"` is not removing the padding – Prerna Rawat Dec 30 '15 at 13:46
  • I have updated my answer. If it helped you a little, you can upvote/mark it as accepted :) – Damian Kozlak Dec 30 '15 at 13:59