带有方形子项的方形 GridLayout（边=父宽度）

Question

我正在尝试制作一个方形网格布局（嵌套在约束布局中），所有边都等于父宽度，这样对于任何设备，用户都将在屏幕上拥有最大的可能正方形。然后我想在第一个正方形中再添加四个正方形，它们将是带有背景图像的线性布局，它将根据网格布局单元格大小进行拉伸。理想情况下，我想用 XML 来完成此操作。我是 android 的初学者，请原谅我在以下代码中可能存在的明显问题和错误，但我已经在这方面花费了大量时间，没有任何进展。任何帮助表示赞赏。下面是我的 main.xml，其中单元格具有固定尺寸。我尝试过改变重量和重力，但没有成功。只是想知道是否有一种简单的方法可以使这段代码执行我想要的操作。<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="horizontal">    <GridLayout        android:id="@+id/foursquares"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:columnCount="8"        android:orientation="vertical"        android:rowCount="8"        app:layout_constraintBottom_toBottomOf="parent"        app:layout_constraintEnd_toEndOf="parent"        app:layout_constraintStart_toStartOf="parent"        app:layout_constraintTop_toTopOf="parent">        <LinearLayout            android:id="@+id/a1"            android:layout_width="100dp"            android:layout_height="100dp"            android:layout_row="0"            android:layout_rowSpan="1"            android:layout_column="0"            android:layout_columnSpan="1"            android:background="@drawable/blacksquare"            android:orientation="horizontal"></LinearLayout>        <LinearLayout            android:id="@+id/a2"            android:layout_width="100dp"            android:layout_height="100dp"            android:layout_row="0"            android:layout_rowSpan="1"            android:layout_column="1"            android:layout_columnSpan="1"            android:background="@drawable/whitesquare"            android:orientation="horizontal"></LinearLayout>

Answer 1

ConstraintLayout的主要优点是允许您使用平面视图层次结构创建大型且复杂的布局。没有像RelativeLayout或LinearLayout等那样的嵌套视图组。您可以使用ConstraintLayout为android制作响应式UI，与RelativeLayout和GridLayout相比，它更灵活。

ConstraintLayout 允许您轻松地将任何视图限制为percentage width or height. 所以我稍微编辑了你的代码。兄弟看看吧，希望对你有帮助。

<?xml version="1.0" encoding="utf-8"?>

    <androidx.constraintlayout.widget.ConstraintLayout

        xmlns:android="http://schemas.android.com/apk/res/android"

        xmlns:app="http://schemas.android.com/apk/res-auto"

        xmlns:tools="http://schemas.android.com/tools"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:orientation="horizontal"

        android:padding="16dp">

            <LinearLayout

                android:id="@+id/a1"

                android:layout_width="0dp"

                app:layout_constraintWidth_percent=".48"

                android:layout_height="0dp"

                app:layout_constraintHeight_percent=".3"

                android:background="@drawable/blacksquare"

                app:layout_constraintStart_toStartOf="parent"

                app:layout_constraintTop_toTopOf="parent"

                android:padding="8dp"

                android:orientation="horizontal">

            </LinearLayout>

            <LinearLayout

                android:id="@+id/a2"

                android:layout_width="0dp"

                android:layout_height="0dp"

                app:layout_constraintWidth_percent=".48"

                app:layout_constraintHeight_percent=".3"

                android:background="@drawable/blacksquare"

                app:layout_constraintEnd_toEndOf="parent"

                app:layout_constraintTop_toTopOf="parent"

                android:padding="8dp"

                android:orientation="horizontal">

            </LinearLayout>

            <LinearLayout

                android:id="@+id/a3"

                android:layout_width="0dp"

                app:layout_constraintWidth_percent=".48"

                android:layout_height="0dp"

                app:layout_constraintHeight_percent=".3"

                android:background="@drawable/blacksquare"

                app:layout_constraintStart_toStartOf="parent"

                app:layout_constraintTop_toBottomOf="@+id/a1"

                android:layout_marginTop="16dp"

                android:orientation="horizontal">

            </LinearLayout>

            <LinearLayout

                android:id="@+id/a4"

                android:layout_width="0dp"

                android:layout_height="0dp"

                app:layout_constraintWidth_percent=".48"

                app:layout_constraintHeight_percent=".3"

                android:background="@drawable/blacksquare"

                app:layout_constraintEnd_toEndOf="parent"

                android:layout_marginTop="16dp"

                app:layout_constraintTop_toBottomOf="@id/a2"

                android:orientation="horizontal">

            </LinearLayout>

        <LinearLayout

            android:id="@+id/a5"

            android:layout_width="0dp"

            app:layout_constraintWidth_percent=".48"

            android:layout_height="0dp"

            app:layout_constraintHeight_percent=".3"

            android:background="@drawable/blacksquare"

            android:layout_marginTop="16dp"

            app:layout_constraintStart_toStartOf="parent"

            app:layout_constraintTop_toBottomOf="@+id/a3"

            android:orientation="horizontal">

        </LinearLayout>

        <LinearLayout

            android:id="@+id/a6"

            android:layout_width="0dp"

            android:layout_height="0dp"

            app:layout_constraintWidth_percent=".48"

            app:layout_constraintHeight_percent=".3"

            android:background="@drawable/blacksquare"

            app:layout_constraintEnd_toEndOf="parent"

            android:layout_marginTop="16dp"

            app:layout_constraintTop_toBottomOf="@id/a4"

            android:orientation="horizontal">

        </LinearLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>