Navigation Drawer breaking layout

Question

Trying to add a Navigation Drawer which is breaking my layout. The main layout has some buttons, an Edit Text box and a Listview. The drawer also has a list view. When I add the drawer, the Listview on the main layout takes on a grey colour and takes over the entire screen. The drawer however, works as expected.

Here are my layout files:

<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="1000dp"
android:id="@+id/drawer_layout"
tools:context=".Departures"
android:weightSum="3" >

<!-- The main content view -->

<TextView
    android:id="@+id/textView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:layout_marginBottom="12dp"
    android:layout_marginTop="12dp"
    android:gravity="center_horizontal"
    android:text="@string/activity_departures"
    android:textSize="24sp" />

<TextView
    android:id="@+id/div_bar_1"
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:layout_marginBottom="7dp"
    android:background="#666666"
    android:text="@string/empty" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <Button
        android:id="@+id/terminal_1_btn"
        style="@style/navigation_btn"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="5dp"
        android:layout_weight="1.5"
        android:background="@drawable/navigation_btn"
        android:minHeight="2dp"
        android:text="@string/terminal_1_btn" />

    <Button
        android:id="@+id/terminal_2_btn"
        style="@style/navigation_btn"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="10dp"
        android:layout_weight="1.5"
        android:background="@drawable/navigation_btn"
        android:minHeight="2dp"
        android:text="@string/terminal_2_btn" />
</LinearLayout>

<TextView
    android:id="@+id/div_bar_2"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:layout_marginBottom="7dp"
    android:layout_marginTop="7dp"
    android:background="#999999"
    android:text="@string/empty" />

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <Button
        android:id="@+id/button1"
        style="@style/navigation_btn"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight="1"
        android:background="@drawable/navigation_btn"
        android:minHeight="2dp"
        android:text="@string/today_btn" />

    <Button
        android:id="@+id/button2"
        style="@style/navigation_btn"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_weight="1"
        android:background="@drawable/navigation_btn"
        android:minHeight="2dp"
        android:text="@string/tomorrow_btn" />

    <Button
        android:id="@+id/button3"
        style="@style/navigation_btn"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:layout_weight="1"
        android:background="@drawable/navigation_btn"
        android:minHeight="2dp"
        android:text="@string/variable" />
</LinearLayout>

<TextView
    android:id="@+id/div_bar_3"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:layout_marginBottom="7dp"
    android:layout_marginTop="7dp"
    android:background="#999999"
    android:text="@string/empty" />

<EditText
    android:id="@+id/searchFlights"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:hint="@string/search_flights"
    android:inputType="text"
    android:textSize="14sp" />

<TextView
    android:id="@+id/div_bar_2"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:layout_marginBottom="7dp"
    android:layout_marginTop="7dp"
    android:background="#999999"
    android:text="@string/empty" />

<ListView
    android:id="@android:id/list"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
</ListView>

<!-- The navigation drawer -->

<include layout="@layout/navigation_drawer" />

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

The include file:

    <!-- The navigation drawer -->
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/left_drawer"
android:layout_width="160dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#fff"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp" >

The Drawer Listitem:

   <TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_list_item"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:gravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textColor="#000"
android:background="?android:attr/activatedBackgroundIndicator"
android:minHeight="?android:attr/listPreferredItemHeightSmall"/>

The height of the root element (1000dp) is only to address a display issue on the emulator. Help! I'm stuck on this for hours...

Answer 1

The height of the root element(1000dp) is only to address a display issue on the emulator..

I really don't get what you're doing here, as the XML seems overly complex for what you've described as your goal. The suggested way to set up a Nav Drawer is so simple and straightforward. I also don't see where you've defined a FrameLayout that will host the rest of your layout(or main content). It's really the best way to go and leads to much cleaner looking XML. You define your main content layout inside your FrameLayout(wrap your textviews and edittexts inside linearlayout or something) and have them be descendants of said FrameLayout. Then add your DrawerLayout which contains your navigation list.

You have child TextViews and EditTexts floating around, outside of ViewGroups and it just doesn't make any sense to me why those aren't wrapped in appropriate parents.

The sample implementation is really all you need, as I've built complex layouts using ViewPagers, Fragments, composite views etc etc and they've all worked well with Navigation Drawer because I followed the instructions the developer guide suggested.

<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">
<!-- The main content view -->
<FrameLayout
    android:id="@+id/content_frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
<!-- The navigation drawer -->
<ListView android:id="@+id/left_drawer"
    android:layout_width="240dp"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:choiceMode="singleChoice"
    android:divider="@android:color/transparent"
    android:dividerHeight="0dp"
    android:background="#111"/>