带有4个按钮的android的ImageLayout

Question

I'm currently making an app where I want an imageview on top of the screen (with a gap of 10% of the screen from top) and a table under the imageview with 4 buttons in it.

What I have right now is:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/testhback"
android:gravity="bottom" >

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="@dimen/f1"
    android:adjustViewBounds="true"
    android:src="@drawable/img1" />

<TableLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="@dimen/top2"
    android:stretchColumns="*" >

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

        <Button
            android:id="@+id/button5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_below="@+id/button4"
            android:onClick="changepic2"
            android:text="Breaking Dawn" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBaseline="@+id/button1"
            android:layout_alignBottom="@+id/button1"
            android:layout_alignLeft="@+id/button5"
            android:layout_alignParentRight="true"
            android:onClick="changepic3"
            android:text="New Moon (2)" />
    </TableRow>

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

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_above="@+id/button3"
            android:layout_alignParentLeft="true"
            android:onClick="changepic"
            android:text="Twilight (1)" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:onClick="changepic1"
            android:text="Eclipse (3)" />
    </TableRow>
</TableLayout>

The problem is that I've tried to set margins from the top for the table. But on each screen it looks different, and I didn't figure out how to tell it to automatically take, let's say, 10% for top line under it, 70% for the imageview, and 20% for the table with 4 button in it at the bottom.

Answer 1

You can use the LinearLayout with vertical orientation and configure the layout_weight attribute in order to make this arrangement.

For more information please check here http://blog.stylingandroid.com/archives/297 and come back if the problem remains.

Hope this helps!

Answer 2

you must use android:layout_width = 0dp, android:weightSum and android:layout_weight

that thread should help you out