Android:创建方形单元格表

kal*_*ehv 5 android textview android-ui android-tablelayout android-gridlayout

我正在为 android 设计一个基本的井字游戏,作为我的“Hello World”项目。我想要一个 3x3 表格,其中所有单元格都是正方形。

如果其中的任何单元格中没有任何内容,我所做的方式会使列缩小。我正在尝试使用 GridLayout 中的 9 个 TextView。

我欢迎所有建议来做到这一点。

我的方式看起来像这样 - 在此处输入图片说明

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    style="@style/LayoutStyle"
    tools:context=".GameBoard">


    <GridLayout
        style="@style/GameBoardGrid"
        android:id="@+id/gridTitle">

        <TextView
            android:id="@+id/tile00"
            style="@style/GameTile"
            android:layout_column="0"
            android:layout_row="0"
            android:text=""/>

        <TextView
            android:id="@+id/tile01"
            style="@style/GameTile"
            android:layout_column="1"
            android:layout_row="0"
            android:text="X"/>

        <TextView
            android:id="@+id/tile02"
            style="@style/GameTile"
            android:layout_column="2"
            android:layout_row="0"
            android:text="O"/>

        <TextView
            android:id="@+id/tile10"
            style="@style/GameTile"
            android:layout_column="0"
            android:layout_row="1"
            android:text=""/>

        <TextView
            android:id="@+id/tile11"
            style="@style/GameTile"
            android:layout_column="1"
            android:layout_row="1"
            android:text="O"/>

        <TextView
            android:id="@+id/tile12"
            style="@style/GameTile"
            android:layout_column="2"
            android:layout_row="1"
            android:text="X"/>

        <TextView
            android:id="@+id/tile20"
            style="@style/GameTile"
            android:layout_column="0"
            android:layout_row="2"
            android:text=""/>

        <TextView
            android:id="@+id/tile21"
            style="@style/GameTile"
            android:layout_column="1"
            android:layout_row="2"
            android:text="X"/>

        <TextView
            android:id="@+id/tile22"
            style="@style/GameTile"
            android:layout_column="2"
            android:layout_row="2"
            android:text="O"/>

    </GridLayout>

</RelativeLayout>
Run Code Online (Sandbox Code Playgroud)

其中,GameTile 的样式是 -

<style name="GameTile">
    <item name="android:textSize">60sp</item>
    <item name="android:layout_gravity">fill</item>
    <item name="android:gravity">center</item>
    <item name="android:paddingLeft">@dimen/padding_grid_text</item>
    <item name="android:paddingRight">@dimen/padding_grid_text</item>
    <item name="android:fontFamily">Roboto-Thin</item>
    <item name="android:background">@color/gray</item>
    <item name="android:layout_margin">@dimen/margin_grid_cell</item>
    <item name="android:layout_weight">1</item>
</style>
Run Code Online (Sandbox Code Playgroud)

Amu*_*are 1

将您的更改GridLayoutLinearLayout如下:

    <TextView
            android:id="@+id/tile00"
            style="@style/GameTile"
            android:text=" "/>

    <TextView
            android:id="@+id/tile01"
            style="@style/GameTile"
            android:text="X"/>

    <TextView
            android:id="@+id/tile02"
            style="@style/GameTile"
            android:text="O"/>

</LinearLayout>
<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/gridTitle">

    <TextView
            android:id="@+id/tile10"
            style="@style/GameTile"
            android:text=""/>

    <TextView
            android:id="@+id/tile11"
            style="@style/GameTile"
            android:text="O"/>

    <TextView
            android:id="@+id/tile12"
            style="@style/GameTile"
            android:text="X"/>

</LinearLayout>
<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/gridTitle">

    <TextView
            android:id="@+id/tile20"
            style="@style/GameTile"
            android:text=""/>

    <TextView
            android:id="@+id/tile21"
            style="@style/GameTile"
            android:text="X"/>

    <TextView
            android:id="@+id/tile22"
            style="@style/GameTile"
            android:text="O"/>

</LinearLayout>
Run Code Online (Sandbox Code Playgroud)

你的风格是:

<style name="GameTile">
    <item name="android:textSize">60sp</item>
    <item name="android:layout_gravity">fill</item>
    <item name="android:gravity">center</item>
    <item name="android:paddingLeft">@dimen/padding_grid_text</item>
    <item name="android:paddingRight">@dimen/padding_grid_text</item>
    <item name="android:fontFamily">Roboto-Thin</item>
    <item name="android:background">@color/gray</item>
    <item name="android:layout_margin">@dimen/margin_grid_cell</item>
    <item name="android:layout_weight">1</item>
    <item name="android:layout_width">0dp</item>
    <item name="android:layout_height">wrap_content</item>
</style>
Run Code Online (Sandbox Code Playgroud)