Android: GridLayout 行都聚集在一起

Question

我正在应用程序中使用网格布局。列工作正常，但行给我带来了问题。

我想在我使用的图像上均匀分布 4 行。但由于某种原因，这些行都挤在一起，只有最后一行在其他行之前。 这是我第一次使用 GridLayout，我看不出我做错了什么。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/imageView"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true"
    android:src="@drawable/pitch"/>

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true"
    android:rowCount="4"
    android:numColumns="5"
    android:id="@+id/formation"
    android:layout_alignBottom="@+id/imageView">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Gk"
        android:layout_row="0"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/gk"
        android:layout_columnSpan="3" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DL"
        android:layout_row="1"
        android:layout_column="0"
        android:layout_gravity="center"
        android:id="@+id/dl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DC"
        android:layout_row="1"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/dcl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DC"
        android:layout_row="1"
        android:layout_column="3"
        android:layout_gravity="center"
        android:id="@+id/dcr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DR"
        android:layout_row="1"
        android:layout_column="4"
        android:layout_gravity="center"
        android:id="@+id/dr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ML"
        android:layout_row="2"
        android:layout_column="0"
        android:layout_gravity="center"
        android:id="@+id/ml" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MC"
        android:layout_row="2"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/mcl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MC"
        android:layout_row="2"
        android:layout_column="3"
        android:layout_gravity="center"
        android:id="@+id/mcr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MR"
        android:layout_row="2"
        android:layout_column="4"
        android:layout_gravity="center"
        android:id="@+id/mr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="FC"
        android:layout_row="3"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/fcl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="FC"
        android:layout_row="3"
        android:layout_column="3"
        android:layout_gravity="center"
        android:id="@+id/fcr" />

</GridLayout>

Answer 1

考虑改为使用垂直 LinearLayout，每行包含水平 LinearLayout（或更多 GridLayout）。然后每个行视图可以将 layout_weight 设置为相同的值，因此它们都分配相同数量的 space。在那种情况下也将它们的 layout_height 设置为 0.

Answer 2

建议您使用 linearlayout 而不是 gridlayout，要在背景中设置图像您需要使用 FrameLayout 如下代码，

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/next"
            android:scaleType="centerCrop" />
    </FrameLayout>

    <LinearLayout
        android:id="@+id/formation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:weightSum="4">

        <LinearLayout
            android:id="@+id/formation1"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <Button
                android:id="@+id/gk"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="Gk" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/formation2"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <Button
                android:id="@+id/dl"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="DL" />

            <Button
                android:id="@+id/dcl"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="DC" />

            <Button
                android:id="@+id/dcr"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="DC" />

            <Button
                android:id="@+id/dr"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="DR" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/formation3"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <Button
                android:id="@+id/ml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="ML" />

            <Button
                android:id="@+id/mcl"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="MC" />

            <Button
                android:id="@+id/mcr"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="MC" />

            <Button
                android:id="@+id/mr"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="MR" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/formation4"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="center">

            <Button
                android:id="@+id/fcl"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="FC" />

            <Button
                android:id="@+id/fcr"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="FC" />
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>

希望这有用。

Answer 3

您可以添加：

android:layout_columnWeight="1"
android:layout_rowWeight="1"

在每个按钮中。像这样：

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:rowCount="4"
    android:numColumns="5"
    android:id="@+id/formation"
    android:layout_alignBottom="@+id/imageView">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Gk"
        android:layout_row="0"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/gk"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_columnSpan="3" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DL"
        android:layout_row="1"
        android:layout_column="0"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_gravity="center"
        android:id="@+id/dl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DC"
        android:layout_row="1"
        android:layout_column="1"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_gravity="center"
        android:id="@+id/dcl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DC"
        android:layout_row="1"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="3"
        android:layout_gravity="centerl"
        android:id="@+id/dcr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="DR"
        android:layout_row="1"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="4"
        android:layout_gravity="center"
        android:id="@+id/dr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ML"
        android:layout_row="2"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="0"
        android:layout_gravity="center"
        android:id="@+id/ml" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MC"
        android:layout_row="2"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/mcl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MC"
        android:layout_row="2"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="3"
        android:layout_gravity="center"
        android:id="@+id/mcr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MR"
        android:layout_row="2"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="4"
        android:layout_gravity="center"
        android:id="@+id/mr" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="FC"
        android:layout_row="3"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="1"
        android:layout_gravity="center"
        android:id="@+id/fcl" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="FC"
        android:layout_row="3"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        android:layout_column="3"
        android:layout_gravity="center"
        android:id="@+id/fcr" />

</GridLayout>

Android: GridLayout 行都聚集在一起

Android: GridLayout rows are all bunched together

android

android-layout

android-gridlayout

android-studio