android xml drawable image on full screen background

Question

I need an xml drawable (for a cordova splash screen) in android. I Want to display a transparent logo centered on the screen (without stretching), while the rest of the screen has a background color set.

What I tried first, was to add only the image in the xml file:

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

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

So I tried different solutions to add a background color to that 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 it is not full screen any more. It adjusts to the image size and gets stretched when showing as full screen.

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

EDIT: All answers suggest using RelativeLayout - but I think this is not possible within an xml file in "drawable", right? I do not have any layout i can edit - only a drawable which gets referenced by cordova.

score 25 · Accepted Answer · answered Apr 23 '15 at 11:07

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 the layout still wrong - but it works on the device as expected.

To all posters, suggesting adding a layout-xml file: As I stated in the question, I don't have the possibility to do that, since this drawable gets included from Cordova. I don't have control over the used layout around this drawable.

score 12 · Answer 2 · answered Jun 27 '16 at 07:48

12

<?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" />

answered Jun 27 '16 at 07:48

Hiran

257
3
7

score 2 · Answer 3 · answered Apr 23 '15 at 08:27

2

do this way,

   <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>

answered Apr 23 '15 at 08:27

Jignesh Jain

1,518
12
28

I only have an xml file in "drawable" folder i can edit - when I try to add a RelativeLayout in this files, android studio says "Element RelativeLayout must be declared". Are you sure it is possible to use RelativeLayout within drawable xml files? – Ralf Apr 23 '15 at 09:23
1

this is xml file put this into your layout folder and set background as your drawble color xml – Jignesh Jain Apr 23 '15 at 10:01

BSavaliya · Answer 4 · 2015-04-23T09:37:50.623

0

You can use following code for your need:

   <?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>

edited Apr 23 '15 at 09:37

answered Apr 23 '15 at 08:44

BSavaliya

809
1
16
26

I only have an xml file in "drawable" folder i can edit - when I try to add a RelativeLayout in this files, android studio says "Element RelativeLayout must be declared". Are you sure it is possible to use RelativeLayout within drawable xml files? – Ralf Apr 23 '15 at 09:23
Its code for layout xml file not for drawable xml file – BSavaliya Apr 23 '15 at 09:24
Well but question says "xml drawable" – Ralf Apr 23 '15 at 09:25
still getting issue then tell me – BSavaliya Apr 23 '15 at 09:41
This could work, it's close to the solution I found. But I didn't test it. Thanks anyway! – Ralf Apr 23 '15 at 11:08

score -1 · Answer 5 · answered Apr 23 '15 at 08:30

No need to use other relative layout for background color. You can do it using single ImageView like:

<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" />

android xml drawable image on full screen background

5 Answers5

Linked