How to Customize the Layout (height and Width), and containership of layouts?

Question

I have created a TableLayout with two rows where first row has one TextView and second row has two columns, first one has a ListView and the second one has one EditText and a Button each in different rows. I want both rows of equal height (exactly half of the screen) and both of the columns of second row should be of equal width (exactly half of the screen). I Want to build something like this:

How should I proceed ? Which layout I should choose?

Answer 1

I don't think your current solution will work(because of the requirement for equal space(width and height) + the ListView presence). One solution is to use nested weights(which are bad for performance, but(probably, without knowing what you do) not something that important that will break your app) like in the layout below:

<?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="vertical" >

    <include
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        layout="@layout/identical_layout" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="TextView" />

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <ListView
            android:id="@+id/list"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1" >
        </ListView>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:orientation="vertical" >

            <EditText
                android:layout_width="fill_parent"
                android:layout_height="wrap_content" />

            <Button
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="ddd" />
        </LinearLayout>
    </LinearLayout>




</LinearLayout>

Another option to avoid the nested weights problem is to use a RelativeLayout like below(I haven't tested it):

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

    <include
        android:id="@+id/included_layout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        layout="@layout/identical_layout" />

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/included_layout" >

        <View
            android:id="@+id/anchor"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_centerVertical="true" />

        <TextView
            android:id="@+id/textView1"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_above="@id/anchor"
            android:layout_alignParentTop="true"
            android:background="#99cc00"
            android:text="TextView" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_alignParentBottom="true"
            android:layout_below="@id/anchor" >

            <ListView
                android:id="@+id/list"
                android:layout_width="0dp"
                android:layout_height="fill_parent"
                android:layout_weight="1" >
            </ListView>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:orientation="vertical" >

                <EditText
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content" />

                <Button
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="ddd" />
            </LinearLayout>
        </LinearLayout>
    </RelativeLayout>

</RelativeLayout>

The identical_layout layout file represents the common layout shared by your Activities.