LinearLayout of three elements with uniform occuped space

Question

I want to create a horizontal linearlayout with two button and one imageview such that all three elements occupy equal amount of space.For that i have set android:layout_weight="1" in all the three elements.Still i see space occupied by all three elements is different with middle element with largest space then the third and first one with smallest.

<LinearLayout
    android:id="@+id/footerpreview"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_alignParentBottom="true"
    android:visibility="visible"
    >
    <ImageView
        android:id="@+id/face"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/face"
        android:background="#2D4487"
        android:gravity="center"
        android:padding="10dp"
        />

    <ImageView
        android:id="@+id/gyee"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/gyee"
        android:background="#469AEB"
        android:gravity="center"
        android:padding="10dp"
        />
    <Button
        android:id="@+id/submit"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:text="Submit"
        android:textSize="18dp"
        android:textColor="#FFFFFF"
        android:gravity="center"
        android:layout_gravity="center"
        android:background="#F3931D"/>
</LinearLayout>

score 2 · Accepted Answer · answered Oct 07 '15 at 15:20

2

You just need to change

android:layout_width="wrap_content"

to

android:layout_width="0dp"

for all of your three Views and they'll get laid out equally.

answered Oct 07 '15 at 15:20

Ravi K Thapliyal

51,095
9
76
89

@Amar Actually, the content will be clipped so it won't have any effect on the allocation of space. – Ravi K Thapliyal Oct 07 '15 at 15:36
So what is the use of weight sum and layout weight ? – Amar Oct 07 '15 at 15:41
@Amar As an aside, your previous comment was not notified to OP because you didn't call him out using `@`; or you need to post your comment in response to the question. – Ravi K Thapliyal Oct 07 '15 at 15:42

score 1 · Answer 2 · answered Oct 08 '15 at 11:03

To keep all the buttons in of same size you need to to keep the width attribute to "fill_parent". Below is the working xml. weightsum should be equal to the number of buttons you want to use.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" 
        android:weightSum="4">

    <Button
        android:id="@+id/button1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />
    <Button
        android:id="@+id/button2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />
    <Button
        android:id="@+id/button3"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button" />
    <ImageView
    android:id="@+id/face"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:src="@drawable/ic_launcher"
    android:background="#2D4487"
    android:gravity="center"/>


    </LinearLayout>

see snapshot

Amar · Answer 3 · 2015-10-07T15:19:19.190

0

You need to add weight sum of 1 for your parent layout and assign layout weights for the childs dividing this 1 between them as much space as you want . In your case, you should assign weight sum of 3 to parent and layout weight 1 for the childs to let them occupy the equal space

edited Oct 07 '15 at 15:19

answered Oct 07 '15 at 15:12

Amar

141
1
11

same output i assigned `android:layout_weight="3"` to LinearLayout and `android:layout_weight="1"` to all three elements – Oct 07 '15 at 15:19
for linear layout android:weightSum="3" and for childs android:layout_weight="1" – Amar Oct 07 '15 at 15:21

LinearLayout of three elements with uniform occuped space

3 Answers3