Image on xroid android browser on full screen background

Question

I need xml drawable (for splash screen for cordova) in android. I want to display a transparent logo in the center of the screen (without stretching), and the background color is set on the rest of the screen.

At first I tried to add only the image to the xml file:

<?xml version="1.0" encoding="utf-8"?> <bitmap android:src="@drawable/splashscreen" android:gravity="center_horizontal|center_vertical" /> 

This showed a logo centered on the screen, but (obviously) has no background color.

So, I tried different solutions to add background color to this xml. For example:

 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape android:shape="rectangle"> <solid android:color="#FFFFFF" /> </shape> </item> <item> <bitmap android:src="@drawable/splashscreen" android:gravity="center_horizontal|center_vertical" /> </item> </layer-list> 

Now the image has a background color - but this is no longer a full screen. It adjusts to image size and stretches when displayed in full screen.

So, how can I get a full screen with a background color and a centered image on it?

EDIT: All answers suggest using RelativeLayout - but I think this is not possible in the XML file in "drawable", right? I don’t have any layout that I can edit - only with the drawing ability referenced by the cordova.

Answer 1

I found the solution myself:

 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <color android:color="#FFFF"></color> </item> <item> <bitmap android:src="@drawable/splashscreen" android:gravity="center_horizontal|center_vertical" /> </item> </layer-list> 

Android studio shows that the layout is still wrong, but it works on the device as expected.

For all posters offering to add a layout-xml file: As I said in the question, I have no way to do this, since this drawable will be included from Cordoba. I have no control over the layout used around this drawing.

Answer 2

 <?xml version="1.0" encoding="UTF-8"?> <bitmap xmlns:android="http://schemas.android.com/apk/res/android" android:src="@drawable/splash" android:gravity="fill_horizontal|fill_vertical" /> 

Answer 3

do it,

  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/white" >//Set background color <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:adjustViewBounds="true" android:src="@drawable/splash_logo" />//set logo </RelativeLayout> 

Answer 4

You can use the following code for your needs:

  <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item android:drawable="@color/bg_color"/> <item> <bitmap android:gravity="center|bottom|clip_vertical" android:src="@drawable/your_image" /> </item> </layer-list> 

Answer 5

No need to use a different relative layout for the background color. You can do this using a single ImageView, for example:

 <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/imageView" android:src="@drawable/noise" android:scaleType="centerInside" android:background="@android:color/black" />