简体   繁体   中英

How to properly distribute 4 buttons on an android layout

Im trying to distribute 4 image buttons into the 4 possible screen corners (regardless of res) of an android layout. I want the image background to be static (ie 50x50 dip) and I would also like to have the android.gesture.GestureOverlayView layer on full-screen in the background. Im having a hard time figuring this out and Im very newby on droid dev. working with eclipse+AVD 2.1.1

many thanks!!

<?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:background="#6495ED"
    android:gravity="fill"
    android:launchMode="singleInstance"
    android:orientation="vertical" >

    <!-- ICON -->
    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TableLayout
        android:id="@+id/tableLayout2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:stretchColumns="*">


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

       <!-- SETTINGS -->
            <Button
                android:id="@+id/button1"
                android:layout_width="50dip"
                android:layout_height="50dip"
                android:layout_gravity="left"
                android:layout_weight="1"
                android:background="@drawable/options"
                android:clickable="true"
                android:minHeight="50dp"
                android:minWidth="50dp"
                android:visibility="visible" />

        <!-- LIST -->
            <Button
                android:id="@+id/button4"
                android:layout_width="0dip"
                android:layout_height="50dip"
                android:layout_gravity="right"
                android:layout_weight="1"
                android:background="@drawable/list"
                android:clickable="true"
                android:maxHeight="50dp"
                android:maxWidth="50dp"
                android:visibility="visible" />
        </TableRow>



   <!-- GESTURE (GOES FULL SCREEN ON BACKGROUND -->
   <android.gesture.GestureOverlayView
        android:id="@+id/gestureOverlayView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
   </android.gesture.GestureOverlayView>

        <TableRow>
    <!-- SEARCH -->
        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:background="@drawable/find"
            android:clickable="true"
            android:maxHeight="50dp"
            android:maxWidth="50dp"
            android:visibility="visible" />


    <!-- CLOSE -->
        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:background="@drawable/close"
            android:gravity="right|top" 
            android:clickable="true"
            android:Height="50dp"
            android:Width="50dp"
            android:visibility="visible" />

        </TableRow>

    </TableLayout>
</LinearLayout>

RelativeLayout is the key:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/Frame"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" android:background="#6495ED">

    <android.gesture.GestureOverlayView
        android:id="@+id/gestureOverlayView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
    </android.gesture.GestureOverlayView>

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:background="#F00" />

    <ImageButton
        android:id="@+id/imageButton2"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:background="#F00" />

    <ImageButton
        android:id="@+id/imageButton3"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:background="#F00" />

    <ImageButton
        android:id="@+id/imageButton4"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:background="#F00" />

</RelativeLayout>

Using Relative layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/RelativeLayout"
    android:layout_width="fill_parent"
    android:background="#6495ED"    
    android:layout_height="fill_parent"    
    tools:ignore="HardcodedText" >   

<ImageView
    android:id="@+id/icon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

<android.gesture.GestureOverlayView
    android:id="@+id/gestureOverlayView1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
</android.gesture.GestureOverlayView>    

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:text="Button2" />  

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:text="Button3" />

    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"
        android:text="Button4" />


</RelativeLayout>

在此处输入图片说明

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM