android - 抽屉导航中的背景图像和 ImageView

Question

我正在尝试类似于 Play 商店应用程序的抽屉导航设计:我的菜单部分工作正常，但我想在菜单顶部添加个人资料图片和用户 ID，如下图所示。我不确定如何实现这部分:

我尝试了以下代码并将其添加到包含要显示的项目列表的 xml 中。

<LinearLayout
    android:id="@+id/LinearLayoutFrom1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="left|center"
    android:background="@drawable/bg"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/clear1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/profilepic" />

    <TextView
        android:id="@+id/textViewName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="UserID"
        android:textColor="#FFFFFF"
        android:textSize="15sp"
        android:textStyle="bold" />
</LinearLayout>

但这只是为每个列表项附加背景和文本。

如何实现上述设计？

更新 1:

我在 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/framelayoutid"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />


<LinearLayout
    android:id="@+id/LinearLayoutFrom1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/bg"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/LinearLayoutFrom2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_weight=".20" >

        <ImageView
            android:id="@+id/clear1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/profilepic" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/LinearLayoutFrom3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight=".80"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/textViewName"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="UserID"
            android:textColor="#FFFFFF"
            android:textSize="15sp"
            android:textStyle="bold" />
    </LinearLayout>

    <ListView
        android:id="@+id/left_panel"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@color/list"
        android:choiceMode="singleChoice"
        android:divider="@color/divider"
        android:dividerHeight="1dp"
        android:listSelector="@drawable/selector" />
</LinearLayout>

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

我收到以下错误:

http://txs.io/4bpb

更新 2:

我通过执行以下操作成功地将标题添加到列表中:

    mDrawerList = (ListView) findViewById(R.id.left_menu);

    View header = getLayoutInflater().inflate(R.layout.headerlayoutfordrawer, null); 
    mDrawerList.addHeaderView(header);

    navDrawerItems = new ArrayList<NavDrawerItem>();

    navDrawerItems.add(new NavDrawerItem(navMenuTitles[0], navMenuIcons.getResourceId(0, -1)));
    navDrawerItems.add(new NavDrawerItem(navMenuTitles[1], navMenuIcons.getResourceId(1, -1),true, "2"));
    navDrawerItems.add(new NavDrawerItem(navMenuTitles[2], navMenuIcons.getResourceId(2, -1)));
    navDrawerItems.add(new NavDrawerItem(navMenuTitles[3], navMenuIcons.getResourceId(3, -1)));
    navDrawerItems.add(new NavDrawerItem(navMenuTitles[4], navMenuIcons.getResourceId(4, -1)));
    navDrawerItems.add(new NavDrawerItem(navMenuTitles[5], navMenuIcons.getResourceId(5, -1)));
    navMenuIcons.recycle();

    mDrawerList.setOnItemClickListener(new SlideMenuClickListener());

    adapter = new NavDrawerListAdapter(getApplicationContext(), navDrawerItems);
    mDrawerList.setAdapter(adapter);

但问题是标题也被计算在 DrawerItems 的数组列表中，因此我得到数组 outofboundexception

  07-22 11:18:01.433: E/AndroidRuntime(14229): FATAL EXCEPTION: main
  07-22 11:18:01.433: E/AndroidRuntime(14229): java.lang.ArrayIndexOutOfBoundsException: length=6; index=7
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at com.jlk.trip.maps.displayView(maps.java:192)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at com.jlk.trip.maps.access$0(maps.java:159)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at com.jlk.trip.maps.maps$SlideMenuClickListener.onItemClick(maps.java:122)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.widget.AdapterView.performItemClick(AdapterView.java:298)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.widget.AbsListView.performItemClick(AbsListView.java:1100)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.widget.AbsListView$PerformClick.run(AbsListView.java:2788)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.widget.AbsListView$1.run(AbsListView.java:3463)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.os.Handler.handleCallback(Handler.java:730)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.os.Handler.dispatchMessage(Handler.java:92)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.os.Looper.loop(Looper.java:137)  
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at android.app.ActivityThread.main(ActivityThread.java:5103)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at java.lang.reflect.Method.invokeNative(Native Method)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at java.lang.reflect.Method.invoke(Method.java:525)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:737)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:553)
  07-22 11:18:01.433: E/AndroidRuntime(14229):     at dalvik.system.NativeStart.main(Native Method)

Answer 1

更新:

查看此项目以了解与抽屉相关的所有内容。 https://github.com/Sottti/MaterialDesignNavDrawer

旧答案:

在这里查看我的 xml: https://github.com/Sottti/BuyIt/blob/master/BuyIt/src/main/res/layout/activity_main.xml

注意“您的抽屉”的位置。

Navigation Drawer 是 android.support.v4.widget.DrawerLayout 中的第二个 child 。

第二个 child 是包含 RelativeLayout 和 ListView 的 LinearLayout。

ListView 本身就是抽屉 ListView 。

Relative 布局是图片头所在的地方。

试试吧，它对我有用。

运气!!