Question

I have been trying to get this layout correct and having trouble.

Here is what i would like it to look like in landscape mode.

-------------------------------------------------
A Button                 |A TextView
-------------------------|
A ListView               |
                         |
                         |
                         |
                         |
                         |
-------------------------------------------------

I have tried a few different ways. Below is the closest i have got. However, it makes the TextView take up the majority of the screen.

I want the first half to take up 50% and the second half to take up the other 50% of the width of the screen. I have tried a way that used weights, but i have read that using nested weights is bad.

So i tried switching to RelativeLayout and it had the same problem mentioned above. Thanks for the help in advance!

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

    <TableRow>

        <LinearLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <include
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="0"
                layout="@layout/new_note_button" />

            <fragment
                android:id="@+id/note_list"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                class="ashton.learning.projects.simplenotes.NoteListFragment" />
        </LinearLayout>

        <FrameLayout
            android:id="@+id/note_details"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent">
        </FrameLayout>

    </TableRow>

</TableLayout>

Answer 1

Here is my answer with screen shot from graphical editor, you may want to add your own padding and alignment. The trick to 50/50 (or any other split) is using weightSum on the parent layout then specifying how you want the weights distributed.

In this example the weightSum is 2 and the left side and right share it equally by having a weight of 1. Last trick is to set the layout_width to 0dp.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal"
    android:weightSum="2" >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:background="#c6c6c6"
        android:layout_weight="1" >

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button" />

            <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="REPLACE ME WITH A LIST VIEW"
        android:textAppearance="?android:attr/textAppearanceLarge" />


    </LinearLayout>

    <RelativeLayout
        android:id="@+id/rightPane"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:background="#336699"
        android:layout_weight="1">

        <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="I am the right pane text view"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    </RelativeLayout>

</LinearLayout>