creating background drawable using layer-list, icon getting stretched

Question

Hi I am trying to create a background drawable for my splash screen which I'll be setting in theme itself. But the bitmap drawable used to keep in the center is getting stretched and I am not able to figure how to keep it normal. Below is my drawable code: splash_screen_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
        <gradient
            android:angle="360"
            android:centerColor="@color/colorAccentXDark"
            android:endColor="@color/Black"
            android:gradientRadius="500dp"
            android:startColor="@color/colorAccentXDark"
            android:type="radial"
            android:useLevel="false" />
    </shape>
</item>
<item
    android:bottom="50dp"
    android:top="50dp">
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:innerRadius="500dp"
        android:innerRadiusRatio="1"
        android:shape="oval">
        <gradient
            android:angle="360"
            android:centerColor="@color/colorAccentXDark"
            android:endColor="@color/colorAccentXDark"
            android:gradientRadius="400dp"
            android:startColor="@color/colorAccent"
            android:type="radial"
            android:useLevel="false" />
    </shape>
</item>
<item android:gravity="center">
    <bitmap android:src="@drawable/ty_logo" />
</item>
</layer-list>

Here is code where I am setting this drawable as background of an activity:

 <style name="TYTheme" parent="SearchActivityTheme.NoActionBar">
    <item name="colorPrimaryDark">@color/colorAccentXDark</item>
    <item name="android:alertDialogTheme">@style/AlertDialogTheme</item>
    <item name="android:windowBackground">@drawable/splash_screen_bg</item>
</style>

So here the bitmap drawable ty_logo is an png is getting stretched in my phone. Since there is no scaleType option with bitmapDrawable I don't know how to handle it.

Leucomaine

Did you find any answer to this question? I have the same problem right now and can't find a solution. – Livesay

did not get the solution yet. – Leucomaine

Answer 1

Add gravity to your bitmap set to center.

<item android:gravity="center">
    <bitmap android:src="@drawable/ty_logo" 
            android:gravity="center" />
</item>

Grimalkin

Answer 2

I hope that ty_logo is of suitable pixels and you have provided different pixels image for various device screens (ldpi, mdpi, hdpi, xhdpi, etc). If not, do go through this answer to a similar problem you find yourself in : Resize images in bitmap in xml

Otherwise, this can be easily solved if your target version is for API 23 as <item> has width,height,gravity attributes provided for them.

And if not, the following code should work, using gravity attribute for bitmap. Again, this is going by the assumption that your logo is not having more pixels than resolution of the devices.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
...

<item>
      <bitmap android:src="@drawable/ty_logo"
        android:gravity="center" />
</item>

...
</layer-list>

Araarab

Answer 3

You can wrap bitmap inside ScaleDrawable <scale> and use ScaleDrawable inside LayerListDrawable.

<item android:gravity="center">
    <scale android:drawable="@drawable/ty_logo"
         android:scaleHeight="80%"
         android:scaleWidth="80%" >
    </scale> 
</item>

Listel

I tried adding this one but now ty_logo is not even visible. – Leucomaine

Answer 4

Simple trick without using Bitmap or width-height or margin

Works for APIs+23

Drawables become stretched if we set its gravity other than center (APIs +23). Here is my solution i.e. layer-list in layer-list:

<layer-list>
<!-- Your original vector using layer-list in layer-list -->
<item
    android:gravity="top">
    <layer-list>
        <item android:gravity="center"
              android:drawable="@drawable/ic_check_white_48dp"/>
    </layer-list>
</item>
</layer-list>

This works in APIs +23 because center-gravity has no stretch effect and keeps aspect ratio of drawable. But in APIs 21 and 22 center-gravity is not working properly so this approach will not work.

Secondguess