Android: Navigation drawer item size

Viewed 377

I have an Android app with a navigation drawer in it. The drawer gets its items from a menu resource file.

<com.google.android.material.navigation.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/nav_header_main"
    app:menu="@menu/activity_main_drawer" />

The active item has a semi-transparent layer above it, it's the default stuff. My problem is with the size/margin of that layer.

I would like to have this: https://developer.android.com/training/material/images/navigation-view.png

Instead of this: https://i.stack.imgur.com/Zlp9p.png

I can make it square following this answer, but it still has a small margin around it.

How can I achieve it?

3 Answers

You can use the itemShapeInset* attributes to fill the entire space:

<com.google.android.material.navigation.NavigationView
 app:itemShapeInsetStart="0dp"
 app:itemShapeInsetEnd="0dp"
 app:itemShapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Nav.Square"

and the itemShapeAppearanceOverlay to have square corners:

<style name="ShapeAppearanceOverlay.Nav.Square" parent="">
    <item name="cornerSize">0dp</item>
</style>

enter image description here

Have you tried changing this attribute app:itemHorizontalPadding="0dp".

You want this

 <com.google.android.material.navigation.NavigationView
    android:id="@+id/nav_view"
    style="@style/Widget.Custom.NavigationView"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:clipToPadding="false"
    android:fitsSystemWindows="true"
    android:theme="@style/NavigationTheme"
    app:headerLayout="@layout/nav_header_main"
    app:itemHorizontalPadding="45dp"
    app:itemIconPadding="@dimen/_17sdp"
    app:itemIconTint="#000"
    app:itemTextColor="#000"
    app:menu="@menu/activity_main_drawer" />

styles

  <style name="Widget.Custom.NavigationView" parent="Widget.Design.NavigationView">
    <item name="itemIconTint">?attr/colorNavigationItem</item>
    <item name="itemTextColor">?attr/colorNavigationItem</item>
    <item name="itemBackground">?attr/drawableNavigationItemBackground</item>
</style>
<style name="NavigationTheme" parent="AppTheme">
    <item name="android:layout_marginBottom">4dp</item>
</style>

add attr.xml in values

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <attr name="colorNavigationItem" format="color" />
    <attr name="colorNavigationItemSelected" format="color" />

    <attr name="drawableNavigationItemBackground" format="reference" />
</resources>
Related