Zvi
Zvi

Reputation: 2424

How to control NavigationView margin between menu items

I have a navigation drawer with many items so the user needs to scroll up and down in order to see all the items.

I would like to reduce the margins between individual menu items, so that all items fit within a standard screen with no need to scroll.

Is there a way to control the margins in between the menu items?

Upvotes: 4

Views: 17664

Answers (4)

Freddie
Freddie

Reputation: 210

We can create a drawable and set it as the NavigationView's itemBackground attribute. I will explain below:

If we walk through the NavigationMenuAdapter, we will see there are four types of items:

private static final int VIEW_TYPE_NORMAL = 0;
private static final int VIEW_TYPE_SUBHEADER = 1;
private static final int VIEW_TYPE_SEPARATOR = 2;
private static final int VIEW_TYPE_HEADER = 3;

What we want to work with is VIEW_TYPE_NORMAL. The attributes exposed to developers can be found in the below code:

case VIEW_TYPE_NORMAL:
      {
        NavigationMenuItemView itemView = (NavigationMenuItemView) holder.itemView;
        itemView.setIconTintList(iconTintList);
        if (textAppearanceSet) {
          itemView.setTextAppearance(textAppearance);
        }
        if (textColor != null) {
          itemView.setTextColor(textColor);
        }
        ViewCompat.setBackground(
            itemView,
            itemBackground != null ? itemBackground.getConstantState().newDrawable() : null);
        NavigationMenuTextItem item = (NavigationMenuTextItem) items.get(position);
        itemView.setNeedsEmptyIcon(item.needsEmptyIcon);
        itemView.setHorizontalPadding(itemHorizontalPadding);
        itemView.setIconPadding(itemIconPadding);
        if (hasCustomItemIconSize) {
          itemView.setIconSize(itemIconSize);
        }
        itemView.setMaxLines(itemMaxLines);
        itemView.initialize(item.getMenuItem(), 0);
        break;
      }

Unfortunately,there is no interface for us to add margins between the NavigationMenuItemView. However, it allows us to set a background. So we can set a customer drawable to the NavigationView with a specific height. We only set a height in that drawable, like:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"android:shape="rectangle">
<size android:height="60dp"/>
</shape>

Then apply this drawable to the NavigationView in the layout.xml, like:

   <com.google.android.material.navigation.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    app:itemBackground="@drawable/bk_menu_item"/>

I understand it is not a perfect solution, but it seems the only solution working in my case.

Upvotes: 2

Kevendra
Kevendra

Reputation: 109

add below code in dimens.xml

 <dimen tools:override="true" name="design_navigation_icon_padding">16dp</dimen>

Upvotes: 0

ammar
ammar

Reputation: 25

Paste this in styles.xml

<style name="NavigationTheme" parent="AppTheme">
  <item name="android:textSize">16sp</item>
  <item name="android:layout_marginBottom">02dp</item>
</style>

In navigation drawer put this in each item:

android:theme="@style/NavigationTheme"

Upvotes: 0

Lanitka
Lanitka

Reputation: 932

Answer here helped me to reduce space at least between groups. I used the following dimen

<dimen tools:override="true" name="design_navigation_separator_vertical_padding">1dp</dimen>

Upvotes: 10

Related Questions