Making an 8x8 Grid in Android

Question

I'm trying to make a game of connect 4 for an android app!

I want to make an 8x8 image view but whenever I try to make it (with GridLayout, GridView, or TableLayout), it only shows me up to 4 image views per column. What do I do?

I'm kinda desperate here!

score 0 · Accepted Answer · edited Mar 14 '17 at 05:30

I did a basic sudoko GAME for android. I want a 4x4 table with all cells as squares in it.

I did this with the 16 Buttons in a TableLayout.

My way looks like this

my xml

<TableLayout
android:id="@+id/tl"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="center" >

<TableRow
    android:id="@+id/tableRow1"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:gravity="center" >

    <Button
        android:id="@+id/button1"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="1" />

    <Button
        android:id="@+id/button2"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="2" />

    <Button
        android:id="@+id/button3"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="3" />

    <Button
        android:id="@+id/button4"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="4" />
</TableRow>

<TableRow
    android:id="@+id/tableRow2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center" >

    <Button
        android:id="@+id/button5"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="5" />

    <Button
        android:id="@+id/button6"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="6" />

    <Button
        android:id="@+id/button7"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="7" />

    <Button
        android:id="@+id/button8"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="8" />
</TableRow>

<TableRow
    android:id="@+id/tableRow3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center" >

    <Button
        android:id="@+id/button9"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="9" />

    <Button
        android:id="@+id/button10"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="7" />

    <Button
        android:id="@+id/button11"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="8" />

    <Button
        android:id="@+id/button12"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="7" />
</TableRow>

<TableRow
    android:id="@+id/tableRow3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center" >

    <Button
        android:id="@+id/button13"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="9" />

    <Button
        android:id="@+id/button14"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="7" />

    <Button
        android:id="@+id/button15"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="8" />

    <Button
        android:id="@+id/button16"
        style="@style/box_sky_blue"
        android:layout_weight="1"
        android:text="7" />
</TableRow>
</TableLayout>

Here is box sky blue:

<style name="box_sky_blue">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:background">@color/box_color_sky_blue</item>
    <item name="android:layout_margin">5dp</item>
    <item name="android:padding">5dp</item>
    <item name="android:textSize">20sp</item>
    <item name="android:gravity">center</item>
    <item name="android:textColor">#ffffff</item>
</style>

Same way you can have square of 8x8

Making an 8x8 Grid in Android

1 Answers1