Android：創建方形細胞表

Question

我正在爲Android設計一個基本的tic tac腳趾遊戲作爲我的'Hello World'項目。 我想要一個3x3的表格，所有單元格都是正方形。

我做的這種方式會使列縮小，如果它的任何單元格中沒有任何內容。 我想在GridLayout中使用9個TextViews。

我歡迎所有建議來做到這一點。

我的方法是這樣的 -

<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> 

哪裏，風格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> 

Answer 1

更改GridLayout到LinearLayout如下：

<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> 

而且你的風格：

<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>