Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android NavigationView with internal spacing

I am currently developing an Android App with a support NavigationView. I have to question to make it as I want it: (1) I want to divide the navigation elements into two areas: one at top below the header and one at the bottom end. (2) I want to remove the padding between the divider and the element below it.

How it looks vs how it should look: How it looks vs how it should look

I know there is a way to override the padding value, which would fix (2). But this feels kind of dirty and maybe there is another approach to achieve both of this. My idea was to get the "Settings"-element and change its layout programmatically, but so far I didn't find a way to get that working. Or do I really have to build the footer myself?

Also, I am not quite sure what buzzwords I should be googling. Maybe there is already an easy answer out there.

My current code. Right now there are no layout changes inside the Activity, therefore I did not add it.

activity_main.xml:

<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/main_drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".main.MainActivity">

    <!-- The content -->
    <LinearLayout>...</LinearLayout>

    <!-- The navigation drawer -->
    <android.support.design.widget.NavigationView
        android:id="@+id/main_navigationview"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@android:color/white"
        app:headerLayout="@layout/mainnav_header"
        app:itemBackground="@drawable/menu_background"
        app:itemIconTint="@color/menu_text"
        app:itemTextColor="@color/menu_text"
        app:menu="@menu/maindrawer">

    </android.support.design.widget.NavigationView>

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

menu.xml:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<group android:id="@+id/main_drawer_menu1" android:checkableBehavior="single">
    <item
        android:id="@+id/main_navigationview_request"
        android:checkable="false"
        android:enabled="false"
        android:icon="@drawable/ic_navigationdrawer_request"
        android:title="@string/main_navigation_request"
        app:actionLayout="@layout/menuitem_default" />
    <item
        android:id="@+id/main_navigationview_invitations"
        android:checked="true"
        android:icon="@drawable/ic_navigationdrawer_invitations"
        android:title="@string/main_navigation_invitations"
        app:actionLayout="@layout/menuitem_default" />
    <item
        android:id="@+id/main_navigationview_prev"
        android:icon="@drawable/ic_navigationdrawer_previous"
        android:title="@string/main_navigation_previnvites"
        app:actionLayout="@layout/menuitem_default" />
    <item
        android:id="@+id/main_navigationview_info"
        android:icon="@drawable/ic_navigationdrawer_info"
        android:title="@string/main_navigation_info"
        app:actionLayout="@layout/menuitem_default" />
</group>
<group android:id="@+id/main_drawer_menu2" android:checkableBehavior="single">
    <item
        android:id="@+id/main_navigationview_settings"
        android:checked="true"
        android:icon="@drawable/ic_navigationdrawer_settings"
        android:title="@string/main_navigation_settings"
        app:actionLayout="@layout/menuitem_default" />
    <item
        android:id="@+id/main_navigationview_logout"
        android:icon="@drawable/ic_navigationdrawer_logout"
        android:title="@string/main_navigation_logout"

        app:actionLayout="@layout/menuitem_caution" />
</group>

like image 535
gtRfnkN Avatar asked Oct 31 '22 00:10

gtRfnkN


1 Answers

This line remove padding between icon and text.

only add below line in dimen.xml file

<dimen tools:override="true" name="design_navigation_icon_padding">10dp</dimen>
like image 93
Ankur Bavishi Avatar answered Nov 15 '22 11:11

Ankur Bavishi