android gridlayout columnSpan not spanning

Question

Purpose:

I am attemping to create a simple keypad, using a GridLayout and Buttons

Using the columnSpan feature of a GridLayout, my numeric keypad consists of buttons 0-9 and a clear button spanning 2 columns.

Problem:

The clear Button which should span 2 columns is not functioning correctly, i.e. it simply is not spanning the 2 columns.

GridLayout snippet:

    <GridLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent">
        <Button
                android:layout_row="0"
                android:layout_column="0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button1"
                android:text="1"/>
        <Button
                android:layout_row="0"
                android:layout_column="1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button2"
                android:text="2"/>
        <Button
                android:layout_row="0"
                android:layout_column="2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button3"
                android:text="3"/>
        <Button
                android:layout_row="1"
                android:layout_column="0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button4"
                android:text="4"/>
        <Button
                android:layout_row="1"
                android:layout_column="1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button5"
                android:text="5"/>
        <Button
                android:layout_row="1"
                android:layout_column="2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button6"
                android:text="6"/>
        <Button
                android:layout_row="2"
                android:layout_column="0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button7"
                android:text="7"/>
        <Button
                android:layout_row="2"
                android:layout_column="1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button8"
                android:text="8"/>
        <Button
                android:layout_row="2"
                android:layout_column="2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button9"
                android:text="9"/>
        <Button
                android:layout_row="3"
                android:layout_column="0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/button0"
                android:text="0"/>
        <Button
                android:layout_row="3"
                android:layout_column="1"
                android:layout_columnSpan="2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/buttonClear"
                android:text="Clear"/>


    </GridLayout>

What am I missing and how can I fix it?

Answer 1

Add layout_gravity attribute:

<Button
    android:layout_row="3"
    android:layout_column="1"
    android:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/buttonClear"
    android:text="Clear"/>