10

I have a RelativeLayout with two buttons at bottom which are side by side. My goal is to have those buttons side by side but filling the screen width. Can somebody tell me how to do it?

My layout file is:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Left Button" android:id="@+id/button" android:layout_alignParentTop="false" android:layout_weight="1" android:layout_marginTop="77dp" android:layout_alignParentLeft="true" android:layout_alignParentBottom="true" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Right Button" android:id="@+id/button2" android:layout_weight="1" android:layout_toRightOf="@id/button" android:layout_alignParentBottom="true" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> </RelativeLayout>
Improve this question
2
  • You need a LinearLayout with a horizontal orientation. The buttons then should split the widths between them while their parent LinearLayout has a match parent width. Commented Jul 29, 2015 at 9:28
  • 2
    2 second googling turned up this post: stackoverflow.com/questions/22982566/… Commented Jul 29, 2015 at 9:30

5 Answers 5

Reset to default
14 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity"> <TextView android:id="@+id/dummyView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" /> <Button android:id="@+id/button" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_toLeftOf="@id/dummyView" android:text="Left Button" /> <Button android:id="@+id/button2" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_toRightOf="@id/dummyView" android:text="Right Button" />

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

Can be done without weight which is heavy in xml. Just try with relative layout itself.
This should have been the chosen answer. It's better to avoid nested Linear Layouts
I like your solution.. layout weight sometimes break when using textviews. This is better solution! Anyway a view separator could be used instead of textview to give much feel to the UI.! :)
this is a memory-efficient answer.
Perfect answer.
13

Put your Buttons in a LinearLayout which has horizontal orientation. And assign weight to your buttons.

Here's your code but modified.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity">\ <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:orientation="horizontal"> <Button android:id="@+id/button" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_alignParentTop="false" android:layout_weight="0.5" android:text="Left Button" /> <Button android:id="@+id/button2" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="0.5" android:text="Right Button" /> </LinearLayout>

Improve this answer

1 Comment

Better luck next time :-)
2

Try this.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" > <TableRow android:layout_width="fill_parent" android:layout_height="wrap_content" android:weightSum="2" > <Button android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="Left Button" android:id="@+id/button" android:layout_alignParentTop="false" android:layout_marginTop="77dp" android:layout_alignParentLeft="true" android:layout_alignParentBottom="true" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> <Button android:layout_width="0dp" android:layout_height="wrap_content" android:text="Right Button" android:id="@+id/button2" android:layout_weight="1" android:layout_toRightOf="@id/button" android:layout_alignParentBottom="true" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> </TableRow> </RelativeLayout>
Improve this answer

Comments

1

It's very simple, if you see in the palette for the buttons you can see the attribute: "layout:alignComponent" very useful to align all views in a RelativeLayout; So you can align a left side of button2 to right side of button1... Simple... No LinearLayout needed...

<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Right Button" android:id="@+id/button2" android:layout_weight="1" android:layout_toRightOf="@+id/button" android:layout_alignParentBottom="false" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Left Button" android:id="@+id/button" android:layout_alignParentTop="false" android:layout_weight="1" android:layout_alignParentLeft="false" android:layout_alignParentBottom="false" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" android:layout_alignTop="@+id/button2" />
Improve this answer

Comments

1

My goal is to have those buttons side by side but filling the screen width.

If that's what you want , use a LinearLayout with android:orientation="horizontal" and for buttons use android:layout_width="0dp" , android:weight="1" in order to take up exactly equal space for each button.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" android:orientation="horizontal" tools:context=".MainActivity"> <Button android:layout_width="0dp" android:layout_height="wrap_content" android:text="Left Button" android:id="@+id/button" android:layout_alignParentTop="false" android:layout_weight="1" android:layout_marginTop="77dp" android:layout_alignParentLeft="true" android:layout_alignParentBottom="true" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> <Button android:layout_width="0dp" android:layout_height="wrap_content" android:text="Right Button" android:id="@+id/button2" android:layout_weight="1" android:layout_toRightOf="@id/button" android:layout_alignParentBottom="true" android:layout_alignParentEnd="false" android:layout_alignParentStart="false" /> </RelativeLayout>
Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.