RelativeLayout center vertical

Question

I want to make a list row layout. This layout has a imageview in the most left, a textview right next to the imageview, and a imageview in the most right. I want all of them are center vertical.

<RelativeLayout
    android:layout_width="fill_parent" android:layout_height="100dp"
    android:gravity="center_vertical"
    >
    <ImageView 
        android:id="@+id/icon"
        android:layout_width="50dp" android:layout_height="50dp"
        android:layout_gravity="center_vertical" />
    <TextView 
        android:id="@+id/func_text" android:layout_toRightOf="@id/icon"
        android:layout_width="wrap_content" android:layout_height="100dp"
        android:layout_gravity="center_vertical" />
    <ImageView 
        android:layout_width="50dp" android:layout_height="50dp"
        android:layout_alignParentRight="true"
        android:layout_gravity="center_vertical"
        android:src="@drawable/arrow" />
</RelativeLayout>

I also tried to add android:layout_centerVertical="true" to the textview, but the result is the textview align bottom with the two imageview. I tried this in android 4.2 emulator. Anybody could help me about this?

score 205 · Answer 1 · answered May 10 '13 at 03:36

205

use

 android:layout_centerVertical="true"

answered May 10 '13 at 03:36

stinepike

54,068
14
92
112

34

This should be the correct answer, cause RelativeLayout doesn't have layout_gravity attribute. – MightySeal Aug 07 '14 at 04:33
"invalid param in a linear layout" – Acauã Pitta Dec 13 '19 at 05:23

score 86 · Accepted Answer · answered May 10 '13 at 04:05

I have edited your layout. Check this code now.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#33B5E5"
android:padding="5dp" >

<ImageView
    android:id="@+id/icon"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_alignParentLeft="true"
    android:layout_centerInParent="true"
    android:background="@android:drawable/ic_lock_lock" />

<TextView
    android:id="@+id/func_text"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:layout_gravity="center_vertical"
    android:layout_toRightOf="@+id/icon"
    android:gravity="center"
    android:padding="5dp"
    android:text="This is my test string............"
    android:textColor="#FFFFFF" />

<ImageView
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:layout_alignParentRight="true"
    android:layout_centerInParent="true"
    android:layout_gravity="center_vertical"
    android:src="@android:drawable/ic_media_next" />

</RelativeLayout>

fullmoon · Answer 3 · 2018-05-29T10:53:00.627

24

If View's height/width = wrap_content

use:

android:layout_centerHorizontal="true"
android:layout_centerVertical="true"

If View's height/width = match_parent

use:

android:gravity="center_vertical|center_horizontal"

edited May 29 '18 at 10:53

answered Jun 05 '16 at 19:58

fullmoon

8,030
5
43
58

score 9 · Answer 4 · answered Jan 17 '15 at 13:56

9

For me, I had to remove

<item name="android:gravity">center_vertical</item>

from RelativeLayout, so children's configuration would work:

<item name="android:layout_centerVertical">true</item>

answered Jan 17 '15 at 13:56

ViliusK

11,345
4
67
71

hidro · Answer 5 · 2014-11-25T03:00:38.447

Try aligning top and bottom of text view to one of the icon, this will make text view sharing same height as them, then set gravity to center_vertical to make the text inside text view center vertically.

<TextView 
        android:id="@+id/func_text" android:layout_toRightOf="@id/icon"
        android:layout_alignTop="@id/icon" android:layout_alignBottom="@id/icon"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:gravity="center_vertical" />

score 4 · Answer 6 · answered Oct 26 '14 at 09:59

This is working for me.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rell_main_bg"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#096d74" > 

<ImageView 
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:src="@drawable/img_logo_large"
    android:contentDescription="@null" />

</RelativeLayout>

score 1 · Answer 7 · answered May 10 '13 at 03:50

1

This maybe because the textview is too high. Change android:layout_height of the textview to wrap_content or use

android:gravity="center_vertical"

answered May 10 '13 at 03:50

Bolton

2,226
3
25
29

score 1 · Answer 8 · answered Jan 29 '18 at 18:09

1

Adding both android:layout_centerInParent and android:layout_centerVertical work for me to center ImageView both vertical and horizontal:

<ImageView
    ..
    android:layout_centerInParent="true"
    android:layout_centerVertical="true"
    />

answered Jan 29 '18 at 18:09

Ghasem

14,455
21
138
171

score 0 · Answer 9 · answered Feb 27 '20 at 05:50

       <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentStart="true"
                android:layout_centerInParent="true"
                android:layout_gravity="center_vertical"
                android:layout_marginTop="@dimen/main_spacing_extra_big"
                android:orientation="horizontal">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"

                    android:fontFamily="@font/noto_kufi_regular"
                    android:text="@string/renew_license_municipality"
                    android:textColor="@color/sixth_text"
                    android:textSize="@dimen/main_text" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:fontFamily="@font/noto_kufi_regular"
                    android:text="@{RenewLicenseBasicInfoFragmentVM.tvMunicipality}"
                    android:textColor="@color/sixth_text"
                    android:textSize="@dimen/main_text" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentEnd="true"
                android:layout_centerInParent="true"
                android:layout_gravity="center_vertical"
                android:layout_marginTop="@dimen/main_spacing_extra_big"
                android:orientation="horizontal">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="end"
                    android:fontFamily="@font/noto_kufi_regular"
                    android:text="@string/renew_license_license_number"
                    android:textColor="@color/sixth_text"
                    android:textSize="@dimen/main_text" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="end"
                    android:fontFamily="@font/noto_kufi_regular"
                    android:text="@{RenewLicenseBasicInfoFragmentVM.tvLicenseNum}"
                    android:textColor="@color/sixth_text"
                    android:textSize="@dimen/main_text" />
            </LinearLayout>`enter code here`

        </RelativeLayout>

score 0 · Answer 10 · answered Dec 01 '20 at 00:04

        <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:layout_marginHorizontal="5dp"
        android:layout_marginBottom="5dp"
        android:background="@drawable/default_button">

        <ImageView
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_alignParentLeft="true"
            android:layout_centerInParent="true"
            android:layout_marginStart="15dp"
            android:src="@drawable/google" />

        <Button
            android:id="@+id/btnGmailLogin"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@null"
            android:paddingHorizontal="15dp"
            android:text="@string/gmail_login_button_text"
            android:textAllCaps="false"
            android:textColor="@color/black" />
    </RelativeLayout>

If it's an answer, please right down the some description/information with your answer. — mufazmi, Dec 01 '20 at 00:26

RelativeLayout center vertical

10 Answers10