ab11
ab11

Reputation: 20090

Android: how evenly space components within RelativeLayout?

I am trying to organize 3 LinearLayouts, such that one is justified to the left, one to the right, and the 3rd is between the two with equal amount of blank space on either side. I think I wrap these in a RelativeLayout to accomplish this. Then set one layout to alignParentLeft and the 2nd layout to alignParentRight. But for the 3rd layout, I would like to set layout_marginLeft = (RelativeLayout.width - (layout1.width + layout2.width + layout3.width))/2. Though, I don't see how to do this in xml. Any suggestions?

*Edit. Based on suggestions, I am now using a LinearLayout. This is closer to working, but the 3 Layouts are not evenly spaced, and the right layout is not right justified. Below is my xml:

<LinearLayout 
        android:id="@+id/toolbar"
        android:orientation="horizontal"
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:layout_gravity="bottom"
        android:paddingTop="4dip"
        android:paddingBottom="4dip"
        android:background="#50000000"
        android:visibility="visible">
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="wrap_content"
            android:layout_weight="1"
            android:layout_height="wrap_content">
               <ImageButton 
                    android:id="@+id/open"
                    android:src="@drawable/open"
                    android:layout_width="wrap_content" 
                    android:layout_height="wrap_content">
               </ImageButton>
        </LinearLayout>
        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="wrap_content"
            android:layout_weight="1"
            android:layout_height="wrap_content">
            <ImageButton 
                android:id="@+id/prev"
                android:src="@drawable/prev"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </ImageButton>
            <TextView
                android:id="@+id/totalpages"
                android:text="0 of 0"
                android:layout_gravity="center"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content" 
                android:textColor="#FFFFFFFF">
            </TextView>
            <ImageButton 
                android:id="@+id/next"
                android:src="@drawable/next"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </ImageButton>
        </LinearLayout>
        <LinearLayout
            android:orientation="horizontal"
            android:layout_gravity="right"
            android:layout_width="wrap_content"
            android:layout_weight="1"
            android:layout_height="wrap_content">
            <ImageButton 
                android:id="@+id/zoomout"
                android:src="@drawable/zoomout"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </ImageButton>
            <ImageButton 
                android:id="@+id/zoomin"
                android:src="@drawable/zoomin"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </ImageButton>
        </LinearLayout>
    </LinearLayout>

Upvotes: 8

Views: 11344

Answers (1)

achie
achie

Reputation: 4746

Use a LinearLayout instead of the RelativeLayout and use layout_weight attribute. You might need to set the layout_width to 0dip and then set the weight to something like 0.33

Edit: Yes you can use a weight 1 or any other equal weight below 1. example

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        >
        <TextView  
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:text="string 1 for test...."
            />
    </LinearLayout>
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        >
        <TextView  
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
        android:layout_gravity="center_horizontal"
            android:text="string 2 for test...."
            />
    </LinearLayout>
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        >
        <TextView  
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
        android:layout_gravity="right"
            android:text="string 3 for test...."
            />
    </LinearLayout>
</LinearLayout>

Upvotes: 13

Related Questions