How to center an ImageView in a LinearLayout?

Viewed 93625

The following XML code doesn't work to center an ImageView in a LinearLayout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/myimg" 
        android:layout_width="36dip"
        android:layout_height="36dip"
        android:scaleType="fitXY"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/my_background"
    />
</LinearLayout>

And this is RelativeLayout code which surprisingly works:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/myimg" 
        android:layout_width="36dip"
        android:layout_height="36dip"
        android:scaleType="fitXY"
        android:layout_centerHorizontal="true"
        android:background="@drawable/my_background"
    />
</RelativeLayout>

Can someone tell me why? Thanks!

9 Answers

Sorry, but above code didn't work for me, so i posting my Code which worked for me is

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary"
    android:gravity="center_horizontal|center_vertical"
    android:orientation="vertical">

   <ImageView
        android:id="@+id/ivPic"
        android:layout_width="70dp"
        android:layout_height="70dp" />

</LinearLayout>

I hope it helps for others who need.

The problem is because you use android:layout_width="fill_parent" in LinearLayout. Change it to "wrap_content"

let's keep the UI clean and simple to understand.

 <LinearLayout
        android:id="@+id/relativeLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/phone_auth_bg"
        android:orientation="vertical">


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center">

            <ImageView
                android:id="@+id/imageMobile"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:src="@drawable/phone" />

        </RelativeLayout>

And if any attributes need to be changed in the image-section, you may bring the change as it won't cause any changes in the layout UI.

Try layout_gravity and gravity attributes in the LinearLayout to make all the childs to be centered by default.

For example,

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".SplashActivity">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#000000"
        android:orientation="vertical"
        android:layout_gravity="center"
        android:gravity="center">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:foregroundGravity="center"
            app:srcCompat="@mipmap/app_icon_foreground">
        </ImageView>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Authenticator"
            android:textColor="#FFF"
            android:textSize="40dp"
            android:layout_margin="10dp">
        </TextView>
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

This above is a splash screen activity. So there are two childs - ImageView and TextView. Both are center aligned.

Try layout_gravity and gravity attributes in your Linear Layout and ImageView properly

<LinearLayout
    android:layout_width="match_parent" android:layout_height="250dp"
    android:background="@drawable/profile_background" android:gravity="center">

    <ImageView
        android:layout_width="150dp" android:layout_height="100dp"
        android:background="@mipmap/app_icon" android:layout_gravity="center"/>

</LinearLayout>

Above code worked for me. Hope this will help other users.

Related