Divide Screen into Four Equal Parts using Relative Layout

问题

I currently have code that allows me to divide the screen into four equal parts, with an image button in each part. However, the code uses linear layouts which brings up the suggestion "nested weights are bad for performance". How can I make my layout using relative layouts? Below is the code, and here is a picture of the intended format

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1.0"

        android:orientation="horizontal"
        android:background="#ff191919">

        <ToggleButton
            android:id="@+id/button1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#ff414141"
            android:layout_weight="1.0"
            android:text="Plane"
            android:layout_margin="5dp"
            android:textSize="20sp"
            android:onClick="airplaneClicked"/>


        <ImageButton
            android:id="@+id/button2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#ff414141"
            android:layout_weight="1.0"
            android:layout_margin="5dp"
            android:scaleType="fitCenter"
            android:src="@drawable/ic_brightness"/>


    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1.0"
        android:orientation="horizontal"
        android:background="#ff191919">01

        <ImageButton
            android:id="@+id/button3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#ff414141"
            android:layout_weight="1.0"
            android:layout_margin="5dp"
            android:scaleType="fitCenter"
            android:src="@drawable/ic_sound" />


        <ImageButton
            android:id="@+id/settingsbutton"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#ff414141"
            android:layout_weight="1.0"
            android:layout_margin="5dp"
    android:scaleType="fitCenter"
    android:src="@drawable/settings2"/>

    </LinearLayout>
    </LinearLayout>

回答1:

Using below xml:

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

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.5" >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.5"
        android:background="#242425"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView"
            android:textColor="#d5d5d5" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.5"
        android:background="#d5d5d5"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView" />

    </LinearLayout>

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.5" >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.5"
        android:background="#d5d5d5"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.5"
        android:background="#242425"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView"
            android:textColor="#d5d5d5" />

    </LinearLayout>


</LinearLayout>

回答2:

Try this code for your RelativeLayout.

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

    <RelativeLayout
        android:id="@+id/r3"
        android:layout_width="match_parent"
        android:layout_height="225dp"
        android:layout_marginBottom="10dp"
        android:layout_alignParentTop="true" >

        <ImageButton
            android:id="@+id/i1"
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/ic_launcher" />

        <ImageButton
            android:id="@+id/i2"
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/ic_launcher" />
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/r2"
        android:layout_width="match_parent"
        android:layout_height="225dp"
        android:layout_alignParentBottom="true"
        android:layout_below="@+id/r3" >

        <ImageButton
            android:id="@+id/i3"
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/ic_launcher" />

        <ImageButton
            android:id="@+id/i4"
            android:layout_width="150dp"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:background="@drawable/ic_launcher" />
    </RelativeLayout>

</RelativeLayout>

回答3:

Try this

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1.0">

    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/white"
        android:layout_weight="1"
        android:text="Button" />

    <Button
        android:id="@+id/button2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/holo_green_light"
        android:layout_weight="1"
        android:text="Button" />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1.0"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/button3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/holo_blue_light"
        android:layout_weight="1"
        android:text="Button" />

    <Button
        android:id="@+id/button4"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/holo_red_light"
        android:layout_weight="1"
        android:text="Button" />

</LinearLayout>

来源：https://stackoverflow.com/questions/28660799/divide-screen-into-four-equal-parts-using-relative-layout