colymore
colymore

Reputation: 12316

Image on top of navigation drawer

How can I put an image on top of navigation drawer like Google Play Store or Left sidebar on Google+?

Actually I have my own adapter for the navigation drawer, it put an icon for each element of the list view, and this is the current XML:

<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/frame_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </FrameLayout>

    <ListView
        android:id="@+id/left_menu"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/menuBackground"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp" />

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

I think I must add ImageView in this XML but I'm not sure if this is the correct way.

Upvotes: 2

Views: 3641

Answers (2)

Ookami
Ookami

Reputation: 36

I've just found out how to implement this today (if you have not already solved this problem).

Took me hours to ask the right question

I think you're looking something like this

Image on top of the listview

If so, you need to create a xml files to act as a header and add to the top of the listview.

so just create a header.xml

header.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/img_first"
        android:layout_width="fill_parent"
        android:layout_height="200dp"
        android:scaleType="fitXY"
        android:src="@drawable/hatsune" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Text Name"
        android:background="#88f3f3f3"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_marginRight="20dp"
        android:background="#88f3f3f3"
        android:text="Text Point"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

Back to your activity lets say Activity.java

//Header of the listview, go to header.xml to customize
    View header = getLayoutInflater().inflate(R.layout.header, null);

  //addHeaderView is to add custom content into first row
    yourListView.addHeaderView(header);
    yourListView.setAdapter(yourAdapter);

Upvotes: 2

Ankit Popli
Ankit Popli

Reputation: 2837

I think I must add ImageView in this XML but I'm not sure if this is the correct way.

No, at least in my personal opinion that is not the correct way to implement it. Try to follow a approach like this.

  1. Create a layout you want to add to the top of Navigation Drawer.

  2. Add that layout as a header in your list using getListView().addHeaderView(headerView);

Hope this helps.. :)

Upvotes: 0

Related Questions