RelativeLayout gravity center not working

Question

I'm trying to horizontally center several views in a RelativeLayout that is a base.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center_horizontal"
    android:background="@android:color/transparent" >

This isn't working. I have set centerInParent to true for one of the views and that did work. However, I can't use this solution because I have 2 views side by side that need to be centered together. Trying to optimize this so I want to avoid nesting layouts, especially Linear, inside of each other.

Is there something obvious that I'm missing? I thought this attribute is made for this situation.

score 15 · Accepted Answer · edited May 23 '17 at 11:47

I answered a similar issue involving three views without using nested ViewGroups.

https://stackoverflow.com/a/13279846/1011746

This is tested in API 11.

For the two view horizontal case:

<RelativeLayout
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:gravity="center"
  android:background="@android:color/black"
  >
  <Button
    android:id="@+id/apply"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:text="APPLY"
    android:textSize="20sp"
    />
  <Button
    android:id="@+id/undo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:text="UNDO"
    android:textSize="20sp"
    android:layout_toRightOf="@id/apply"
    />
</RelativeLayout>

For the two view vertical case:

<RelativeLayout
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:gravity="center"
  android:background="@android:color/black"
  >
  <Button
    android:id="@+id/apply"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:text="APPLY"
    android:textSize="20sp"
    />
  <Button
    android:id="@+id/undo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:text="UNDO"
    android:textSize="20sp"
    android:layout_below="@id/apply"
    />
</RelativeLayout>

This solution only works when the views can be stacked in a single line, if the layout is more complex, the only solution is to use nested layouts as the other answers suggest or take a different apprach. — TheIT, Jun 08 '16 at 00:14
@mindriot using _For the two view horizontal case:_ does not perfectly center align both the views as it would when using a nested linear layout with orientation set to horizontal and gravity center — John, Aug 06 '18 at 05:21

score 10 · Answer 2 · answered Jun 05 '12 at 21:06

10

You'll need to nest several layouts together. To center something in a RelativeLayout, you use android:layout_centerInParent="true" on the child. If you try to center several childs, they'll end up under/over each other.

Therefore, for example, you could use a LinearLayout with two views as a child to the RelativeLayout, with the LinearLayout having android:orientation="horizontal" and android:layout_centerInParent="true". The LinearLayout should now be centered in the RelativeLayout, with the two children next to each other.

answered Jun 05 '12 at 21:06

Joakim Berglund

2,859
1
22
30

1

I'm really trying to optimize this screen since it's the main activity. Therefor I'm really really trying to avoid nesting LinearLayouts. I actually removing all the linearlayouts from this apps since they are terrible inefficient. – Frank Sposaro Jun 05 '12 at 21:09
3

Well, there's no way to do it (good looking) if you cannot nest layouts. At least as far as I know. – Joakim Berglund Jun 05 '12 at 21:13

score 2 · Answer 3 · answered Jun 05 '12 at 21:07

2

Wrap the two views in a LinearLayout and then center the LinearLayout in the RelativeLayout like you did for the single TextView.

answered Jun 05 '12 at 21:07

Barak

16,318
9
52
84

Don't want to nest. And that still doesn't explain the issue that centerInParent works when set to true, but is not working when gravity is set to center_horizontal – Frank Sposaro Jun 05 '12 at 21:19
Try `android:layout_gravity="center horizontal"` on your text views. – Barak Jun 05 '12 at 21:39
No. Thanks for the reply, but that isn't going to work. I need two buttons to be side-by-side so center_horizontal for each will put them on top of each other. – Frank Sposaro Jun 05 '12 at 21:42
Then you need to nest layouts. There is no performance hit to that unless you try to nest views using layout_weight. – Barak Jun 05 '12 at 21:53
Actually, you can center in parent and then manipulate the position using margins and the align the other textview to that one if you are determined not to nest layouts. – Barak Jun 05 '12 at 21:54

score 1 · Answer 4 · answered Jun 06 '12 at 14:21

1

So my fix for this issue turn out just to leverage the compound drawable feature of textview. I just trashed the button and used drawableRight to show the search icon.

answered Jun 06 '12 at 14:21

Frank Sposaro

8,511
4
43
64

RelativeLayout gravity center not working

4 Answers4

Linked