Help us understand the problem. What is going on with this article?

NavigationDrawerでDrawer内を入れ子でレイアウトする

More than 5 years have passed since last update.

Navigation Drawerを使う場合、レイアウトにいろいろ制約があります。

  • DrawerLayoutの最初の子がメインコンテンツになります
  • 2番めの子がDrawerになります
  • Drawerはlayout_gravitystartが必要
  • Drawerの幅は240dp以上320dp以下でなくてはいけない

こうしてみるといろいろ制約が多くて面倒ですが、これに沿えば何もしなくてもドロワーが表示されるので、楽ちゃ楽ですね。

但し、一箇所、ハマりどころがあります。例えばドロワー内をListViewだけではなく、複雑なレイアウトにしたいと思いますよね?(威圧)

そう思って以下のように書いたりしてみます。

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView
        android:id="@+id/tv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="Hello World, MyActivity"/>

    <LinearLayout
        android:id="@+id/left_drawer_layout"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#111">

        <TextView
                android:text="sample header"
                android:textColor="#fff"
                android:layout_width="match_parent"
                android:layout_height="48dp"
                android:layout_gravity="start"/>

        <Button
                android:id="@+id/left_drawer_button"
                android:layout_width="wrap_content"
                android:layout_height="48dp"
                android:layout_gravity="start"
                android:text="button"/>

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

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

ルール上、問題無さそうですが、これで実行するとドロワーの中がLinearLayoutの最初の子であるTextViewしか表示されません。紆余曲折ありましたが解決策は単純で以下の行を追加するだけです。

    <LinearLayout
        android:id="@+id/left_drawer_layout"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:orientation="vertical" //←これ!
        android:background="#111">

ソースを追っかけて見たけど、childCount周りでおかしな制御してるようだが、わからなかった(敗北)。とりあえずこれでドロワー内を好きにレイアウトできるようになります。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした