android - 如何在相对度量中指定 Android GridLayout 单元格的宽度和高度？

Question

我试图弄清楚GridLayout是如何工作的，但我无法从文档中弄清楚的一件事是如何或是否可以控制网格单元的大小。

假设我想要一个两乘二的网格，其中每个单元格恰好占据屏幕空间的 25%（半高，半宽）——我可以这样做吗？

使用LinearLayout，我可以通过将两个水平LinearLayout 嵌套在一个垂直中，然后为所有元素分配权重1 来实现这一点。GridLayout 虽然不支持 weight 属性。

Answer 1

有两个属性 android:layout_columnWeight 和 layout_rowWeight 与 LinearLayout 中的 layout_weight 类似。这在 API 21 中得到支持。对于较旧的 android 设备，请使用 v7 支持库中的 GridLayout。

这些属性将允许您根据分配给每列的值调整列的宽度/高度。公式是这样的 (column_weight/ sum_of_column_weight) * gridLayout_width = column_width。

这是一个示例，它是一个 2 行 2 列均匀分布的网格视图，每一个占网格重量和高度的 50%。

<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
>

    <TextView
        android:text="SEARCH FEE"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
     />

    <TextView
        android:layout_columnWeight="1"
        android:text="SEARCH FEE"
        android:layout_rowWeight="1"
     />

    <TextView
        android:text="SEARCH FEE"
        android:layout_columnWeight="1"
        android:layout_rowWeight="1"
        />

    <TextView
        android:layout_columnWeight="1"
        android:text="SEARCH FEE"
        android:layout_rowWeight="1"
        />
</GridLayout>

Answer 2

根据文档，它看起来像你想要的那样设置应该相当简单：

android:rowCount='2'
android:columnCount='2'

在儿童集中

android:layout_columnSpan="1"
android:layout_rowSpan="1"

该参考文献还提到了拉伸：

为防止柱子拉伸，请确保柱子中的一个组件未定义重力。

这似乎是一种将行和列保持在 50:50 比例而不根据内容调整大小的解决方案

Answer 3

它会是这样的：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:columnCount="2"
    app:rowCount="2">

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:gravity="center"
        android:text="1"
        app:layout_columnWeight="1"
        app:layout_rowWeight="1" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:gravity="center"
        android:text="2"
        app:layout_columnWeight="1"
        app:layout_rowWeight="1" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:gravity="center"
        android:text="3"
        app:layout_columnWeight="1"
        app:layout_rowWeight="1" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:gravity="center"
        android:text="4"
        app:layout_columnWeight="1"
        app:layout_rowWeight="1" />

</android.support.v7.widget.GridLayout>

Answer 4

GridLayout里面有一个辅助方法：

GridLayout.LayoutParams params = new GridLayout.LayoutParams();
            params.columnSpec = GridLayout.spec(GridLayout.UNDEFINED, 1, getAlignment(Gravity.NO_GRAVITY, true), 1);
item.setLayoutParams(params);

private GridLayout.Alignment getAlignment(int gravity, boolean horizontal) {
        int mask = horizontal ? HORIZONTAL_GRAVITY_MASK : VERTICAL_GRAVITY_MASK;
        int shift = horizontal ? AXIS_X_SHIFT : AXIS_Y_SHIFT;
        int flags = (gravity & mask) >> shift;
        switch (flags) {
            case (AXIS_SPECIFIED | AXIS_PULL_BEFORE):
                return horizontal ? LEFT : TOP;
            case (AXIS_SPECIFIED | AXIS_PULL_AFTER):
                return horizontal ? RIGHT : BOTTOM;
            case (AXIS_SPECIFIED | AXIS_PULL_BEFORE | AXIS_PULL_AFTER):
                return FILL;
            case AXIS_SPECIFIED:
                return CENTER;
            case (AXIS_SPECIFIED | AXIS_PULL_BEFORE | GravityCompat.RELATIVE_LAYOUT_DIRECTION):
                return START;
            case (AXIS_SPECIFIED | AXIS_PULL_AFTER | GravityCompat.RELATIVE_LAYOUT_DIRECTION):
                return END;
            default:
                return GridLayout.FILL;
        }
    }

通常，这只是可访问的思想反思。

还有更小的版本：

params.columnSpec = GridLayout.spec(GridLayout.UNDEFINED, 1, GridLayout.FILL, 1);

Answer 5

我使用以下尺寸制作了自己的 3 * 3 井字游戏板。此代码用于第一行。我对其他行也做了同样的事情。

    <android.support.v7.widget.GridLayout
    android:id="@+id/gridLayout"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:background="@drawable/board"
    app:columnCount="3"
    app:layout_constraintBottom_toBottomOf="@+id/blackboard"
    app:layout_constraintEnd_toEndOf="@+id/blackboard"
    app:layout_constraintStart_toStartOf="@+id/blackboard"
    app:layout_constraintTop_toTopOf="@+id/blackboard"
    app:rowCount="3">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="80dp"
        android:layout_height="80dp"
        app:layout_column="0"
        app:layout_row="0"
        app:layout_rowWeight="1"
        app:layout_columnWeight="1"
        app:layout_gravity="center"/>

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="80dp"
        android:layout_height="80dp"
        app:layout_column="1"
        app:layout_row="0"
        app:layout_rowWeight="1"
        app:layout_columnWeight="1"
        app:layout_gravity="center"/>

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="80dp"
        android:layout_height="80dp"
        app:layout_column="2"
        app:layout_row="0"
        app:layout_rowWeight="1"
        app:layout_columnWeight="1"
        app:layout_gravity="center"/>