Need help setting up Android TableLayout

Question

I am trying to build a calculator layout using TableLayout, but the last two lines do not match the rest of the layout. Is there something wrong with my XML layout?

What I'm trying to do would be easier to accomplish in HTML ( <td> with colspan or rowspan ), so should I try to convert this to a WebView?

The code is as follows: ( Screenshot )

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <EditText android:id="@+id/EditText01" android:layout_height="wrap_content" android:layout_width="fill_parent" /> <TableLayout android:layout_height="fill_parent" android:layout_width="fill_parent" android:stretchColumns="*"> <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1"> <Button android:id="@+id/Button08" android:textSize="16pt" android:text="^" android:layout_weight="1" android:layout_height="fill_parent" android:layout_width="wrap_content" /> <Button android:id="@+id/Button09" android:text="÷" android:textSize="16pt" android:layout_height="fill_parent" android:layout_weight="1" android:layout_width="wrap_content" /> <Button android:id="@+id/Button10" android:text="×" android:textSize="16pt" android:layout_height="fill_parent" android:layout_weight="1" android:layout_width="wrap_content" /> <Button android:id="@+id/Button11" android:textSize="16pt" android:text="-" android:layout_weight="1" android:layout_height="fill_parent" android:layout_width="wrap_content" /> </TableRow> <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2"> <LinearLayout android:layout_width="wrap_content" android:layout_height="fill_parent" android:orientation="vertical" android:layout_weight="1"> <Button android:id="@+id/Button01" android:text="7" android:textSize="16pt" android:layout_weight="1" android:layout_height="wrap_content" android:layout_width="fill_parent" /> <Button android:layout_height="wrap_content" android:textSize="16pt" android:text="4" android:id="@+id/Button05" android:layout_weight="1" android:layout_width="fill_parent" /> </LinearLayout> <LinearLayout android:layout_height="fill_parent" android:orientation="vertical" android:layout_weight="1" android:layout_width="fill_parent"> <Button android:id="@+id/Button02" android:layout_height="wrap_content" android:text="8" android:textSize="16pt" android:layout_weight="1" android:layout_width="fill_parent" /> <Button android:layout_height="wrap_content" android:textSize="16pt" android:text="5" android:id="@+id/Button06" android:layout_weight="1" android:layout_width="fill_parent" /> </LinearLayout> <LinearLayout android:layout_height="fill_parent" android:orientation="vertical" android:layout_weight="1" android:layout_width="fill_parent"> <Button android:id="@+id/Button03" android:text="9" android:textSize="16pt" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1" /> <Button android:textSize="16pt" android:text="6" android:id="@+id/Button07" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1" /> </LinearLayout> <Button android:id="@+id/Button04" android:text="+" android:textSize="16pt" android:layout_height="fill_parent" android:layout_width="fill_parent" android:layout_weight="1" /> </TableRow> <TableRow android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="2"> <LinearLayout android:layout_width="wrap_content" android:layout_height="fill_parent" android:orientation="vertical" android:layout_weight="2"> <LinearLayout android:layout_weight="1" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"> <Button android:id="@+id/Button02" android:textSize="16pt" android:layout_weight="1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="1" /> <Button android:textSize="16pt" android:id="@+id/Button06" android:layout_weight="1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="2" /> </LinearLayout> <Button android:id="@+id/Button01" android:layout_height="wrap_content" android:textSize="16pt" android:layout_weight="1" android:layout_width="fill_parent" android:text="0" /> </LinearLayout> <LinearLayout android:layout_width="wrap_content" android:layout_height="fill_parent" android:orientation="vertical" android:layout_weight="1"> <Button android:id="@+id/Button03" android:textSize="16pt" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1" android:text="3" /> <Button android:textSize="16pt" android:id="@+id/Button07" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="1" android:text="." /> </LinearLayout> <Button android:id="@+id/Button04" android:textSize="16pt" android:layout_height="fill_parent" android:layout_width="fill_parent" android:layout_weight="1" android:text="=" /> </TableRow> </TableLayout> </LinearLayout> 

Answer 1

Your last TableRow has three cells (i.e. immediate children). The rest are four. Therefore, they will not be aligned unless you put the android:layout_span attribute there to indicate which cell absorbs the fourth.