Search code examples
androidxmldrawable

android xml drawable image on full screen background


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.


Solution

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