如何在一个布局中放置4个相等的矩形?

时间:2017-02-20 09:03:33

标签: android xml android-layout

我想制作像图片的布局,但只是使用相对和线性布局。我想要4个相等的部分。我不想只放4个按钮或其他对象。只需要4个相等的空间。

4 equal parts

3 个答案:

答案 0 :(得分:0)

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

<LinearLayout
android:layout_height="0dp"
android:layout_width="match_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:weightSum="2"
>
<LinearLayout
    android:layout_height="match_parent"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:background="@color/red"
    />

<LinearLayout
    android:layout_height="match_parent"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:background="@color/black"
    />

<LinearLayout
    android:layout_height="0dp"
    android:layout_width="match_parent"
    android:orientation="horizontal"
    android:layout_weight="1"
    android:weightSum="2"
    >
    <LinearLayout
        android:layout_height="match_parent"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:background="@color/green"
        />

    <LinearLayout
        android:layout_height="match_parent"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:background="@color/yellow"
        />



</LinearLayout>

试试这个。

答案 1 :(得分:0)

这是我在评论中说明的解决方案,因为你可以看到是一个LinearLayouts的嵌套

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:weightSum="100"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="net.whatsgift.mitro.weightlayout.MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="horizontal"
        android:weightSum="100">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="50"
            android:backgroundTint="@color/colorAccent"></LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="50"
            android:backgroundTint="@color/colorPrimary"></LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="50"
        android:orientation="horizontal"
        android:weightSum="100">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="50"
            android:backgroundTint=""></LinearLayout>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="50"
            android:backgroundTint="@color/colorAccent"></LinearLayout>
    </LinearLayout>


</LinearLayout>

答案 2 :(得分:0)

使用下面的布局XML文件,就像你的图像一样。

#FirsRowImg {display: flex;flex-wrap: wrap;}