Android TableLayout Manager

Question

I am using a tableLayout for this application and I am trying to have it look like this

http://i698.photobucket.com/albums/vv350/hoosierfan24/appLayout.png

however I cant get it to look like that, and that is my problem. When I attempt to add a second button into the first row, the button is placed underneath the other button not along side of it. How can I change it to make the button appear along side the other?

<?xml version="1.0" encoding="utf-8"?>

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:stretchColumns="*">

    <TableRow>
        <Button android:marqueeRepeatLimit="marquee_forever"
            android:layout_height="74dp" android:id="@+id/button1"
            android:visibility="visible" android:text="Next Picture"
            android:linksClickable="true" android:background="@raw/arrow"
            android:layout_width="122dp"></Button>

            <Button android:marqueeRepeatLimit="marquee_forever"
            android:layout_height="74dp" android:id="@+id/button3"
            android:visibility="visible" android:text="xxxx"
            android:linksClickable="true" android:background="@raw/arrow2"
            android:layout_width="122dp"></Button>

    </TableRow>

    <TableRow>
        <ImageView android:id="@+id/imageView1"
            android:keepScreenOn="true" android:src="@raw/img1"
            android:layout_height="328sp" android:layout_width="323sp"
            android:hapticFeedbackEnabled="false"></ImageView>
    </TableRow>

    <TableRow>
        <Button android:text="Previous Picture" android:onClick="prevPicHandler"
            android:marqueeRepeatLimit="marquee_forever" android:linksClickable="true"
            android:visibility="visible" android:background="@raw/arrow2"
            android:layout_width="122dp" android:layout_height="74dp"
            android:id="@+id/button2"></Button>
    </TableRow>
</TableLayout>

Answer 1

I think for this you should use LinearLayouts instead. Like this:

<?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:layout_width="fill_parent" android:layout_height="wrap_content">
        <Button android:marqueeRepeatLimit="marquee_forever"
        android:layout_height="74dp" android:id="@+id/button1"
        android:visibility="visible" android:text="Next Picture"
        android:linksClickable="true" android:background="@raw/arrow"
        android:layout_width="122dp"></Button>

        <Button android:marqueeRepeatLimit="marquee_forever"
        android:layout_height="74dp" android:id="@+id/button3"
        android:visibility="visible" android:text="xxxx"
        android:linksClickable="true" android:background="@raw/arrow2"
        android:layout_width="122dp"></Button>

    </LinearLayout>


    <ImageView android:id="@+id/imageView1"
        android:keepScreenOn="true" android:src="@raw/img1"
        android:layout_height="328sp" android:layout_width="323sp"
        android:hapticFeedbackEnabled="false"></ImageView>


    <Button android:text="Previous Picture" android:onClick="prevPicHandler"
        android:marqueeRepeatLimit="marquee_forever" android:linksClickable="true"
        android:visibility="visible" android:background="@raw/arrow2"
        android:layout_width="122dp" android:layout_height="74dp"
        android:id="@+id/button2"></Button>

</LinearLayout>