Question

I would like to divide my screen into 4 equal areas like 田.Each one of the four area is a linear layout.

I tried to use relative layout to hold four linear layout like below:

<?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">
    <LinearLayout
        android:id="@+id/up_left_area"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#ffff66"
    >
        <TextView
            android:id="@+id/label1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="UP LEFT"/>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/up_right_area"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"    
        android:layout_toRightOf="@id/up_left_area"
        android:background="#ccffff">

        <TextView
            android:id="@+id/label2"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="UP RIGHT"/>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/down_left_area"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_below="@id/up_left_area"
        android:background="#66cc33"
        >

        <TextView
            android:id="@+id/label3"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="DOWN LEFT"/>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/down_right_area"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/up_right_area"
        android:layout_toRightOf="@id/down_left_area"
         android:background="#cc6600">

        <TextView
            android:id="@+id/label4"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="DOWN RIGHT"/>
    </LinearLayout>
</RelativeLayout>

With the above xml layout code, I do get 4 areas on the screen, but they are not equal sized. How to modify my code to have equal sized 4 areas on the screen like 田 ？

Answer 1

you could use linear layouts with the same layout_weight=1.

simplified xml:

- linearlayout orientation=vertical, layout_width=fill_parent, layout_height=fill_parent
 -- linearLayout orientation=horizontal, layout_weight=1, layout_width=fill_parent, layout_height=fill_parent
 -- -- linearLayout layout_weight=1, layout_width=fill_parent, layout_height=fill_parent
 -- -- -- .... LEFT TOP
 -- -- linearLayout layout_weight=1, layout_width=fill_parent, layout_height=fill_parent
 -- -- -- .... RIGHT TOP
 -- linearLayout orientation=horizontal, layout_weight=1, layout_width=fill_parent, layout_height=fill_parent
 -- -- linearLayout layout_weight=1, layout_width=fill_parent, layout_height=fill_parent
 -- -- -- .... LEFT BOTTOM
 -- -- linearLayout layout_weight=1, layout_width=fill_parent, layout_height=fill_parent
 -- -- -- .... RIGHT BOTTOM

… something like that.