java - 如何以编程方式使用 ImageButtons 填充网格？

Question

我是 Android 开发新手，因此我一直在开发一款国际象棋应用程序来自学。然而，我现在被困住了。本质上，我需要一种好方法来绘制 ImageButtons 的 8x8 网格，这样:

1. 按钮填满整个网格
2. 网格空间均匀分布在按钮之间
3. 按钮之间没有间隙(澄清#2)
4. 网格是方形的，其大小可以控制(我希望能够根据屏幕尺寸自动调整大小)。

或者，简单地说，它应该看起来像一个标准的棋盘:)

我尝试了几种布局，但没有成功。目前，这是我能做的最好的事情:

我在 PlayGameActivity 中按以下方式使用 GridLayout(应在其中绘制板):

public void onStart(){
    super.onStart();

    board = (GridLayout)findViewById(R.id.chessboard);
    board.setColumnCount(8);
    board.setRowCount(8);

    for(int i = 0; i < 8; i++){
        for(int j = 0; j < 8; j++){
            ImageButton square = squares[i][j] = new ImageButton(this);
            GridLayout.LayoutParams params = new GridLayout.LayoutParams();
            params.rightMargin = 0;
            params.topMargin = 0;
            params.height = params.WRAP_CONTENT;
            params.width = params.WRAP_CONTENT;
            params.setGravity(Gravity.FILL);
            params.rowSpec = GridLayout.spec(i);
            params.columnSpec = GridLayout.spec(j);

            board.addView(square, params);

            //board.addView(square);
        }
    }}

棋盘是通过 XML 定义的，如下所示:

<GridLayout
    android:id="@+id/chessboard"
    android:layout_width="353dp"
    android:layout_height="353dp"
    android:layout_marginBottom="104dp"
    android:layout_marginEnd="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="104dp"
    android:background="#000000"
    android:gravity="center_horizontal"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    tools:layout_constraintBottom_creator="1"
    tools:layout_constraintLeft_creator="1"
    tools:layout_constraintRight_creator="1"
    tools:layout_constraintTop_creator="1">
</GridLayout>

我找到的针对此类问题的所有解决方案都是 Android XML 的形式。也许我对这种方法的担忧是基于无知，但我的理解是我必须将 64 个方 block 复制并粘贴到 GridLayout 或其他东西中。另外，我不确定如何使用这种方法根据屏幕尺寸调整大小。理想情况下，我正在寻找严格的编程解决方案(无论如何，这是我首选的 UI 设计方法)。

Answer 1

我的建议是使用 include ( link ) 通过 xml 进行模块化:

<include layout="@layout/titlebar"/>

使用 include 允许您在自己的文件中编写一段 XML 代码，然后多次使用它。我还建议在大多数情况下不要使用 GridLayout，因为它们无法为您提供与其他一些布局类型一样多的控制权。如果这是我的代码，我会这样做:

1. 使用 android:layout_weight="1" 在其自己的 XML 文件中创建一个 ImageButton“正方形”。
2. 在其自己的 XML 文件中使用 android:orientation="horizo​​ntal"、android:layout_weight="1" 和 android:weightSum="8" 创建一个 LinearLayout“row”，然后复制并粘贴 8 个 include 以及 layout="@layout/[your_image_button]"。
3. 在您当前拥有 GridLayout 的位置创建一个外部 LinearLayout。这个将具有 android:orientation="vertical" 和 android:weightSum="8"。然后复制并粘贴 8 个 include 以及 layout="@layout/[your_linear_layout_row]"。

有很多方法可以做到这一点，但这种方法可以让您对所有内容的空间布局方式有很多控制，并且其逻辑与您当前用于动态布局所有内容的“数组的数组”方法非常相似。如果您想走动态 java 路线，我的建议是在 java 中使用这种基于 LinearLayout 的网格方法(您甚至可以在 XML 中创建 ImageButton 并使用 LayoutInflater 来膨胀 ImageButton 的副本)。在外层for循环中，您可以创建一个新的LinearLayout并将其添加到外层LinearLayout中；然后在内部 for 循环中，创建 ImageButton 并将其添加到内部 LinearLayout。

编辑:关于行不同的好点!这使得纯 XML 解决方案不太干净。如果您使用纯 XML，我只需执行上述步骤 2 两次:一次使用白色，然后使用黑色；一次使用白色，然后使用黑色。另一次是黑色然后是白色。对于黑色瓷砖，这可能看起来像:

<include layout="@layout/your_imagebutton"
  android:backgroundColor="#000"
/>

如果这种方法对您来说太麻烦，您可以通过循环遍历 LinearLayout 行和 ImageButton 磁贴来动态设置颜色来设置背景颜色。我认为您会发现它比 GridLayout 方法更容易。