Android development: How to Center an ImageView
Posted: July 31st, 2015 | Author: Julia | Filed under: Mobile Design and Development, Tips and Tricks | Tags: Android, android development, center, LinearLayout, RelativeLayout, splash screen, Xamarin, XAML | No Comments »Android splash screen is used to show a user some kind of progress before the app loads completely. Or you can show case the app or company logo for a couple of second.
A typical splash screen consists of background (color or image) and a centered item.
I created a layout file for splash screen under Resources -> layout folder: activity_splash.axml.
There is no sense to use a LinearLayout for such simple layout (it’s for displaying a number of items in a row). So I started with a RelativeLayout. The key option for the relevant RelativeLayout is android:layout_centerInParent=”true”:
-
<?xml version="1.0" encoding="utf-8"?>
-
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
-
android:id="@+id/RelativeLayout01"
-
android:layout_width="match_parent"
-
android:layout_height="match_parent"
-
android:background="@drawable/blue_wave_background">
-
<ImageView android:id="@+id/imageView1"
-
android:layout_height="wrap_content"
-
android:layout_width="wrap_content"
-
android:layout_centerInParent="true"
-
android:src="@drawable/icon" />
-
</RelativeLayout>
However there could be instances where you need to use a LinearLayout and center content. This case the solution is in android:gravity=”center” for the parent layout:
-
<LinearLayout
-
android:id="@+id/LinearLayout01"
-
android:layout_width="match_parent"
-
android:layout_height="match_parent"
-
android:gravity="center"
-
android:orientation="vertical"
-
android:background="@drawable/blue_wave_background">
-
<ImageButton
-
android:id="@+id/btnFindMe"
-
android:layout_width="wrap_content"
-
android:layout_height="wrap_content"
-
android:background="@drawable/icon" />
-
</LinearLayout>
Leave a Reply