31

There's an unnecessary top padding between the header and the first item shown in this picture.

enter image description here

How it can be removed?

you can find the source code here: https://github.com/chrisbanes/cheesesquare

Gabriele Mariotti
  • 320,139
  • 94
  • 887
  • 841
Ahmed Talaat
  • 641
  • 1
  • 5
  • 14
  • 1
    Just in case you think that is an error, it is not, rather it is part of the Material Design Guidelines. http://www.google.com/design/spec/components/lists.html#lists-specs It should be there is you are trying to keep it up to google standard. It is 8dp padding. – Eugene H Jun 01 '15 at 23:42
  • I don't mean the header, I know it's a guideline. what I meant is the top padding between the first item and the header. – Ahmed Talaat Jun 01 '15 at 23:46
  • 3
    Yes I know that. That is supposed to be there. it is part of the guidelines. Have a look at the image here. There is an 8dp seperator. And it is in all of the Latest google Material Apps. http://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0Bx4BSt6jniD7eUpZcXJRODJvMXc/components_lists_keylines_single5.png – Eugene H Jun 01 '15 at 23:48
  • 1
    Gmail update with material design. But it is only guidelines and could probably be altered. It is a fairly new support library and I am sure more cusumization will be in the near future. http://images.anandtech.com/doci/8671/Screenshot_2014-10-31-22-58-47.png – Eugene H Jun 01 '15 at 23:52
  • Well, you are right but it should give me some control as I think it gives an ugly look when the item is selected. – Ahmed Talaat Jun 01 '15 at 23:56
  • I thought the same exact thing when I implemented material design a while back. It grows on you, I am sure if it is not customizable now, it will be in the near future. – Eugene H Jun 01 '15 at 23:58
  • 2
    I didn't like the top padding at first either. But @EugeneH is right, it's the "official" material design spec, and it's definitely intentional. The more I use it, the more it seems to make good design sense. Depending on what is displayed in the header view, there can be some visual confusion without padding to distinguish list items from header. – hungryghost Jun 08 '15 at 00:11

5 Answers5

58

You can override predefined dimensions at your dimens.xml as;

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

Other possible values are here: https://github.com/android/platform_frameworks_support/blob/master/design/res/values/dimens.xml

Uğur Tılıkoğlu
  • 731
  • 1
  • 6
  • 6
  • @kishorejethava could you please check the resource files under the generated folder? it may be the classic "clean - rebuild" case – Uğur Tılıkoğlu Feb 15 '17 at 13:37
  • 1
    People these values are found at https://github.com/aosp-mirror/platform_frameworks_support/blob/master/design/res/values/dimens.xml – superUser Dec 11 '17 at 14:44
31

You should read the Ian's answer. The NavigationView follows the Material guidelines and you should not break these specs.

However, currently, you can override this value in your project.

Just add to your dimens.xml:

<dimen name="design_navigation_separator_vertical_padding">0dp</dimen>

Warning:

  • in the future the Android Team can change this value!
  • the same value is applied to each separator in the list

The NavigationView uses a LinearLayout as header view. You can see this layout in the source code:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical"
      android:paddingBottom="@dimen/design_navigation_separator_vertical_padding" />
Gabriele Mariotti
  • 320,139
  • 94
  • 887
  • 841
16

NavigationView seeks to match the material design specs for the navigation drawer which state an 8dp space between content areas. Generally there are no ways to override NavigationView to specifically break the specifications.

material design specs

Community
  • 1
  • 1
ianhanniballake
  • 191,609
  • 30
  • 470
  • 443
1

very simple step : add the following attribute to your base application theme (stylename=AppTheme) Style.xml :

        <item name="listPreferredItemHeightSmall">18dp</item>
Liya
  • 568
  • 7
  • 28
0

This is answered here Gabriele's answer

Just add to your dimens.xml:

<dimen name="design_navigation_separator_vertical_padding">0dp</dimen>

Ney Melean
  • 1