customizing Navigation Drawler

Question

Hello i have such layout and i don`t understand how to add static header with photo and text to Navigation Drawler. Any example? Thanks

like this one

<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<!-- As the main content view, the view below consumes the entire
     space available using match_parent in both dimensions. -->
<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<ListView
    android:id="@+id/left_drawer"
    android:layout_width="240dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:choiceMode="singleChoice"
    android:divider="#9d9d9d"
    android:dividerHeight="1dp"
    android:background="#252525" />

Answer 1

It's actually not as simple as user665 suggests. If you're going straight off the example provided by Google, you need to let the DrawerLayout know what its content is by changing DrawerLayout.isDrawerOpen and DrawerLayout.closeDrawer to the View your ListView is wrapped in, otherwise you're going to throw a ClassCastException because the LayoutParams won't match up.

So, to make a static header, you could do somehting like:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <LinearLayout
        android:id="@+id/drawer_content"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:orientation="vertical" >

        <ImageView
            android:id="@android:id/icon"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:contentDescription="@null"
            android:scaleType="centerCrop" />

        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#111"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp" />
    </LinearLayout>

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

Then reference R.id.drawer_content when using the methods I listed above.

Answer 2

After the FrameLayout, the first view will accepted as Navigation Drawer, so you create a layout after FrameLayout, then put your Views inside of it. Here is a example, it is very basic but you will get the point.

<!-- The main content view -->
<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

</FrameLayout>
<!-- The navigation drawer -->


<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout"
    android:layout_height="match_parent"
    android:layout_width="320dp"
    android:orientation="vertical"
    android:layout_gravity="start" >

    <RelativeLayout   
        android:id="@+id/NavDrawerInfo"      
        android:layout_width="320dp"
        android:background="@drawable/bg"
        android:layout_height="100dp">

        <ImageView android:src="@drawable/ic_launcher"
           android:id="@+id/userImage"
           android:layout_width="200dp"
           android:layout_marginRight="200dp"
           android:layout_height="100dp"/>
        <TextView 
             android:id="@+id/userName"
             android:layout_width="wrap_content"
             android:layout_height="100dp"
             android:layout_marginLeft="125dp"
             android:textSize="20sp"
            />
        <TextView 
             android:id="@+id/userImage"
             android:layout_width="wrap_content"
             android:layout_height="100dp"
             android:layout_marginTop="20dp"
             android:layout_marginLeft="125dp"
             android:textSize="20sp"
            />



 </RelativeLayout>
    <ExpandableListView android:id="@+id/left_drawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:choiceMode="singleChoice"
        android:divider="@color/list_divider"
        android:childDivider="@color/list_divider"
        android:groupIndicator="@drawable/group_indicator"
        android:dividerHeight="2dp"
        android:gravity="start" 
        android:background="#f1f1f1"/>


</LinearLayout>



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