Adding a view to a drawer layout in navigation drawer

Question

I have a drawer layout with a navigation view and this is populated with menu items, i want to include an image at the bottom of the drawer below the menu items where there is blank space but having difficulty achieving this, i have tried to add imageview but it places this behind the drawer and not where i was hoping. Another idea i had was to use a footer like the header but this would not work for me! Thank you

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

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

    <android.support.design.widget.NavigationView
        app:theme="@style/NavigationDrawerStyle"
        android:id="@+id/nav_view"
        android:layout_width="400dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:itemTextColor="#FFE300"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer"
        android:background="@drawable/side_nav_bar"/>


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

layout

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

    <group android:checkableBehavior="single">
        <item
            android:id="@+id/first_one"
            android:icon="@drawable/ic_menu_book"
            android:title="To Begin" />

        <item
            android:id="@+id/second_one"
            android:icon="@drawable/nav"
            android:title="Continue" />

        <item
            android:id="@+id/more_stories"
            android:icon="@drawable/navtwo"
            android:title="More Stories" />


        <item
            android:id="@+id/nav_manage"
            android:icon="@drawable/rsz_win"
            android:title="Help" />

        <item
            android:id="@+id/newone"
            android:icon="@drawable/rsz_win"
            android:title="add something here" />
    </group>

    <item android:title="Communicate">

        <menu>
            <item
                android:id="@+id/nav_share"
                android:icon="@drawable/shareicon"
                android:title="Share"/>
            <item
                android:id="@+id/nav_send"
                android:icon="@drawable/send"
                android:title="Send" />
        </menu>
    </item>
</menu>

this does not work as i already have a header in place but thank you for helping — David Marsh, May 11 '16 at 11:24

score 2 · Accepted Answer · answered May 11 '16 at 11:21

2

Try this

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_gravity="start"
        >

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="400dp"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        app:itemTextColor="#FFE300"
        app:menu="@menu/test_menu"
/>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>

answered May 11 '16 at 11:21

Abhishek

1,337
10
29

its the closest so far to what im after but not quite there! the imageview is outside the drawer and not showing correctly unless i shortan the drawer – David Marsh May 11 '16 at 11:39
okay, you can add background color for the linear layout same as the navigation view with height match parent, hope this will help – Abhishek May 11 '16 at 11:45
i have just done that and works great, but because the imageview is not inside the drawer, there is still space below the menu items! would this be a quick fix and i dont think gravity will work on menu items but will try – David Marsh May 11 '16 at 11:51

score 0 · Answer 2 · answered May 11 '16 at 11:17

2 solutions

1. Add your ImageView in your layout as visibility = gone and change it to visible when needed .

See below :

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

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

    <android.support.design.widget.NavigationView
        app:theme="@style/NavigationDrawerStyle"
        android:id="@+id/nav_view"
        android:layout_width="400dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:itemTextColor="#FFE300"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer"
        android:background="@drawable/side_nav_bar"/>


        <ImageView
            android:id="@+id/ivLogo"
            android:layout_width="100dp"
            android:layout_marginTop="30dp"
            android:visibility="gone"       
            android:layout_height="wrap_content"
            android:src="@drawable/YOUR_IMAGE" />


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

in your java code :

Imageview ivLogo = (Imageview) findViewById(R.id.ivLogo);
ivLogo.setVisibility(View.VISIBLE);

2. Add the ImageView dynamically from your java code .

 DrawerLayout drawer_layout = (DrawerLayout) findViewById(R.id.drawer_layout);

 Imageview ivLogo = new Imageview(this);
   // set your image, position, size...
 drawer_layout.addview(ivLogo); // add the view

Hope it helps !

thank you for your help, the first step does not work for me as it places the image behind the navigation drawer and not in the drawer! will try the 2nd method — David Marsh, May 11 '16 at 11:23

Adding a view to a drawer layout in navigation drawer

2 Answers2