2

I'm using android material design drawer layout. Everything is working perfectly. But I'm fetching little bit problem with drawer layout item padding left in Android API lever <= 19.

It works well in Android API level >= 21. Look at the screenshot :

enter image description here

But in Android API level <= 19, drawer layout items don't take proper padding in the left side. Look at the screenshot:

enter image description here

My xml files as following:

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout  xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start"
style="@style/styleActivity">

<include
    layout="@layout/app_bar_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="300dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/nav_header_main"
    app:menu="@menu/activity_main_drawer"


    android:background="@drawable/graphics_drawer_bg"
    app:itemTextColor="@color/white_light"
    app:itemBackground="@drawable/graphics_item_bg"
    app:itemIconTint="@color/white_light"
    />

</android.support.v4.widget.DrawerLayout>

activity_main_drawer.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<group
    android:id="@+id/nav_top"
    android:checkableBehavior="single">
    <item
        android:id="@+id/nav_routine"
        android:icon="@drawable/ic_access_time_accent_24dp"
        android:title="Routines" />
    <item
        android:id="@+id/nav_class"
        android:icon="@drawable/ic_book_accent_24dp"
        android:title="Classes" />
    <item
        android:id="@+id/nav_exam"
        android:icon="@drawable/ic_local_library_black_24dp"
        android:title="Exams" />
    <item
        android:id="@+id/nav_event"
        android:icon="@drawable/ic_date_range_black_24dp"
        android:title="Events" />
    <item
        android:id="@+id/nav_statistics"
        android:icon="@drawable/ic_insert_chart_black_24dp"
        android:title="Statistics" />
</group>

<group
    android:id="@+id/nav_bottom"
    android:checkableBehavior="single">
    <item
        android:id="@+id/nav_settings"
        android:icon="@drawable/ic_settings_black_24dp"
        android:title="Settings" />
    <item
        android:id="@+id/nav_help"
        android:icon="@drawable/ic_help_outline_black_24dp"
        android:title="Help" />
</group>

</menu>

Thanks in advance.

Tariq
  • 35
  • 7

4 Answers4

1

Try adding padding in android.support.design.widget.NavigationView.

For example:

<android.support.design.widget.NavigationView
    ...
    android:padding="10dp"
    ...
/>

As you mentioned in the comment that you want to add padding only in devices having API <= 19. To do this, make two folders in res directory.

values-v11 and values-v21

In these folders, add a file dimens.xml and in it add dimension for NavigationView.

In dimens.xml of values-v11:

<dimen name="padding_left">10dp</dimen>

In dimens.xml of values-v21:

No padding for API >= 21
<dimen name="padding_left">0dp</dimen>

And finally in NavigationView looks like this:

<android.support.design.widget.NavigationView
        ...
        android:paddingLeft="@dimen/padding_left"
        android:paddingStart="@dimen/padding_left"
        ...
    />

Update:

In material design, the margin and padding are predefined but you can override these values.

<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>

I found this here

Community
  • 1
  • 1
Faraz
  • 2,144
  • 1
  • 18
  • 28
  • It takes padding to the whole area of navigation drawer including header part. And takes more padding on API level >=21. But I need to provide padding only on drawer layout items and that should be API level <= 19. – Tariq Sep 07 '16 at 14:36
  • That's great, but you know each item has some background as like app:itemBackground="@drawable/graphics_item_bg" . So, when I put background on "NavigationView", I see some blank space in the left side without background. Actually, I need to provide some padding on navigation drawer items. Is it possible through java code from activity or something like that? – Tariq Sep 07 '16 at 14:48
  • @Tariq If all items have same color then set the color in NavigationView itself rather than every item. – Faraz Sep 07 '16 at 14:51
  • You can see there, each item has a background-image that comes from @drawable/graphics_item_bg.xml – Tariq Sep 07 '16 at 14:55
  • Is there any way to provide padding/margin directly to navigation dwrawer layout items? – Tariq Sep 07 '16 at 14:58
0
Try this as item

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#fff"
        android:padding="20dp"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="#222"
        android:text="bla bla bla" />
Parveen Prajapati
  • 83
  • 1
  • 10
0
  <group
        android:checkableBehavior="single">

        <item
            android:id="@+id/ChatItem"
            android:icon="@drawable/chat_icon"
            android:title="@string/title_chat"/>
        <item
            android:id="@+id/ClipsItem"
            android:icon="@drawable/clips_icon"
            android:title="@string/title_clip"/>

        <item
            android:id="@+id/CretaeItem"
            android:icon="@drawable/new_camera"
            android:title="@string/title_create"/>

        <item
            android:id="@+id/dopeItem"
            android:icon="@drawable/star_icon"
            android:title="@string/tittle_dope"/>

        <item
            android:id="@+id/followersItem"
            android:icon="@drawable/doppes"
            android:title="@string/title_followers"/>

        <item
            android:id="@+id/callPeopleItem"
            android:icon="@drawable/call"
            android:title="@string/title_call_people"/>

        <item
            android:id="@+id/gifs"
            android:icon="@drawable/gf"
            android:title="GIFs"/>

        <item
            android:id="@+id/memes"
            android:icon="@drawable/memos"
            android:title="Memes"/>


        <item
            android:id="@+id/community"
            android:icon="@drawable/comunity"
            android:title="Community"/>


        <item
            android:id="@+id/findPeopleItem"
            android:icon="@drawable/search_new"
            android:title="@string/title_find_people"/>

        <item
            android:id="@+id/settingsItem"
            android:icon="@drawable/setting_icon"
            android:title="@string/settings"/>

        <item
            android:id="@+id/disclaimerItem"
            android:icon="@drawable/disclamer_icon"
            android:title="@string/title_disclaimer"/>

        <item
            android:id="@+id/logoutItem"
            android:icon="@drawable/logout_icon"
            android:title="@string/logout"/>

    </group>
Parveen Prajapati
  • 83
  • 1
  • 10
0

This worked for me

Just add this one line in dimen.xml file

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

this line override padding of navigation menu item.

Ankur Bavishi
  • 943
  • 12
  • 14