Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android: how evenly space components within RelativeLayout?

Tags:

android

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>
like image 714
ab11 Avatar asked Dec 02 '10 19:12

ab11


People also ask

Is it possible to evenly distribute buttons across the width of an android LinearLayout?

Expanding on fedj's answer, if you set layout_width to 0dp and set the layout_weight for each of the buttons to 1, the available width will be shared equally between the buttons.

Which is better LinearLayout or RelativeLayout?

RelativeLayout is used more in applications. We can use LinearLayout inside RelativeLayout. We can also use RelativeLayout as a Child of LinearLayout.

How can I add space between two views in android?

Use the setPadding(left, top, right, bottom) method on the view to set the padding.

What is the difference between FrameLayout and RelativeLayout in android?

RelativeLayout : is a ViewGroup that displays child views in relative positions. AbsoluteLayout : allows us to specify the exact location of the child views and widgets. TableLayout : is a view that groups its child views into rows and columns. FrameLayout : is a placeholder on screen that is used to display a single ...


1 Answers

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>
like image 165
achie Avatar answered Nov 06 '22 11:11

achie