Set the width of relativelayout 1/3 the width of the screen?

Question

I have a layout like below. Now, I don't want to set the width of relative layout to fixed 240 dp. I want to set the width of the relative layout to 1/3 the width of the screen. Is it possible to do that in the xml file. If it is impossible, how can I achieve that using java code ?

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/fullscreen"
        style="@style/translucent">
           <RelativeLayout
            android:layout_width="240dp"
            android:layout_height="fill_parent"
            android:layout_gravity="right"
            android:gravity="center"
            android:background="#88000000"
            android:id="@+id/sidebar">

           </RelativeLayout>

    </FrameLayout>

score 27 · Accepted Answer · edited Nov 19 '15 at 17:10

27

use weightsum="3" in the parent and layout_weight=1 in the child. Take a look a this reference

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/fullscreen"
    style="@style/translucent"
    android:orientation="horizontal"
    android:weightSum="3">

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_gravity="right"
        android:gravity="center"
        android:background="#88000000"
        android:id="@+id/sidebar"
        android:layout_weight="1" 
        >

    </RelativeLayout>

    <!-- other views, with a total layout_weight of 2 -->

</LinearLayout>

edited Nov 19 '15 at 17:10

SMBiggs

11,034
6
68
83

answered Jan 20 '14 at 02:18

Carlos Robles

10,828
3
41
60

what if the LinearLayout has only one child that is the relativelayout. Can I only set layout_weight = 1 in the relativelayout? – Kelvin Tan Jan 20 '14 at 02:57
You can try, and you will learn by yourself! :-) anyways, remember that you can always use a dummy view for this purposes, something like ` ` that will show nothing but will use the extra space – Carlos Robles Jan 20 '14 at 02:59
I wonder if I can implement this without LinearLayout, just using RelativeLayout? thx – thecr0w Jun 06 '22 at 03:33

score 3 · Answer 2 · answered Jan 20 '14 at 02:18

You have to use a LinearLayout to get the width of a view to be a third of its parentview.

Something like:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:background="#88000000">
    </RelativeLayout>
    <ViewGroup
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="2">
    </ViewGroup>
</LinearLayout>

The key bit is the ratio of the layout_weights. The documentation is pretty good.

score 1 · Answer 3 · answered Jan 20 '14 at 02:20

A LinearLayout with a android:layout_orientation="horizontal" is what you want, along with weights.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <RelativeLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        ...all your stuff... />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="2" />


</LinearLayout>

Set the width of relativelayout 1/3 the width of the screen?

3 Answers3