Question

I have an image, as below

I made the above bar and buttons as below in xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >


    <LinearLayout
        android:id="@+id/titleRowId"
        android:layout_width="fill_parent"
        android:layout_height="45dip"
        android:background="@drawable/segment_bar_bg"
        android:gravity="center_vertical|center_horizontal"
        android:orientation="horizontal" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

                <Button
                android:id="@+id/backBtn"
                android:layout_width="wrap_content"
                android:layout_height="32dip"
                android:layout_centerVertical="true"
                android:layout_marginLeft="5dip"
                android:background="@drawable/bar_btn_bg"
                android:padding="0dip"
                android:text="Cancel"
                android:textColor="#FFF" />

                <Button
                android:id="@+id/addBtn"
                android:layout_width="wrap_content"
                android:layout_height="32dip"
                android:layout_centerVertical="true"
                android:layout_marginLeft="250dip"
                android:background="@drawable/bar_btn_bg"
                android:padding="0dip"
                android:text="Done"
                android:textColor="#FFF" />

                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="fill_parent"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentTop="true"
                    android:gravity="center_vertical|center_horizontal"
                    android:text="Convert Amount"
                    android:textColor="#FFFFFF"
                    android:textSize="20sp"
                    android:textStyle="bold" />

        </RelativeLayout>
</LinearLayout>

When I do draw the buttons, according to following design, I face problem in aligments,
As I used TableLayout, and rows for displaying them, as following

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:binding="http://www.gueei.com/android-binding/"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="right|top"
        binding:text="FormattedDisplay"
        android:text="Value"
        android:textSize="45dip" />

    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:stretchColumns="0,1,2">

        <TableRow >

            <Button
                binding:onClick="Number7"
                android:text="7" />

            <Button
                binding:onClick="Number8"
                android:text="8" />

            <Button
                binding:onClick="Number9"
                android:text="9" />
        </TableRow>

        <TableRow >

            <Button
                binding:onClick="Number4"
                android:text="4" />

            <Button
                binding:onClick="Number5"
                android:text="5" />

            <Button
                binding:onClick="Number6"
                android:text="6" />
        </TableRow>

        <TableRow >

            <Button
                binding:onClick="Number1"
                android:text="1" />

            <Button
                binding:onClick="Number2"
                android:text="2" />

            <Button
                binding:onClick="Number3"
                android:text="3" />
        </TableRow>

        <TableRow >

            <Button
                android:layout_span="2"
                binding:onClick="Number0"
                android:text="0" />

            <Button
                binding:onClick="Dot"
                android:text="." />
        </TableRow>

        <TableRow >

            <Button
                binding:onClick="Equal"
                android:text="Convert" />
        </TableRow>
    </TableLayout>

</LinearLayout>

but it not aligning the buttons properly

how to resolve the issue and get desired output?

Can anyone tell me how to choose Layout, so that we can get proper output?

XML output shows are

Answer 1

Take your Convert Button out of the TableLayout and paste it at last place inside LinearLayout after TableLayout as:

<LinearLayout ...  >
    <TextView/>
    <TableLayout>
        <TableRows etc>
    </TableLayout>
    <Button android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        binding:onClick="Equal"
        android:text="Convert" />
</LinearLayout>

and this is giving me the result: