Preventing shapes scaling in a LayeredList without using Bitmap

Question

Trying to use LayerDrawable (defined in XML as layer-list) to layer several shape drawables onto one another; to be used as a background for a layout.

The Android guide (for LayerList) says:

All drawable items are scaled to fit the size of the containing View, by default. Thus, placing your images in a layer list at different positions might increase the size of the View and some images scale as appropriate. To avoid scaling items in the list, use a <bitmap> element inside the <item> element to specify the drawable and define the gravity to something that does not scale, such as "center".

I don't want my shapes to scale, but I'm unsure how to wrap them in bitmap tags correctly: it produces an error if I do it as follows:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <bitmap
            android:src="@drawable/layer_one"
            android:gravity="center" />
    </item>
    <item>
        <bitmap
            android:src="@drawable/layer_two"
            android:gravity="center" />
    </item>
    <item>
        <bitmap
            android:src="@drawable/layer_three"
            android:gravity="center" />
    </item>
    <item>
        <bitmap
            android:src="@drawable/layer_four"
            android:gravity="center" />
    </item>
</layer-list>

Complaining:

Binary XML file line #25: <bitmap> requires a valid src attribute

An example of one of the drawables, e.g. res/drawable/layer_one.xml:

<?xml version="1.0" encoding="utf-8"?>

<!--  res/drawable/layer_one.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <solid android:color="#FFFFFF"/>
    <corners
        android:bottomRightRadius="15dp"
        android:bottomLeftRadius="15dp"
        android:topLeftRadius="15dp"
        android:topRightRadius="15dp" />
</shape>

The example used on the Android site uses images as drawables, not XML-defined shapes (not to say that my error is specific to these, and that I haven't made a silly mistake somewhere). Any clues appreciated, thanks.

Using drawable resources
This question's answer states that you cannot use an XML drawable as the src for a Bitmap. I've amended the title of the question, to now ask how you can prevent shapes from scaling (thereby resizing the container view) without using bitmap, or am I forced to use actual image resources?

Added an image of the desired outcome - the ability to have a background with a regular rectangle filled shape or whatever, and then layered on top of this, more shape drawables (here there are 3 ellipses). On the left is ideal, where top and left offsets are allowed, and on the right is fine, where all shapes just go to a default position:

enter image description here

score 2 · Accepted Answer · edited May 23 '17 at 10:30

2

Yes, (as per my previous answer) you cant use xml drawable for bitmaps. It is fine to build, but when you run the app, it crashes.

Regarding the statement use a <bitmap> element inside the <item> element means that you can define further shapes in your layer-list and that's what it is for. Though you can also define Bitmaps but then your bitmaps should have a src value referring to solid image (not xml).

What you can do is to insert the layer_one, layer_two and other layer's xml into your layer_list xml. For example:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item>
        <shape
            android:shape="rectangle" >
            <solid android:color="#FFFFFF" />

            <corners
                android:bottomLeftRadius="15dp"
                android:bottomRightRadius="15dp"
                android:topLeftRadius="15dp"
                android:topRightRadius="15dp" />
        </shape>
    </item>

    <!-- and so on with your other shapes -->

</layer-list>

Hope it should work :)

edited May 23 '17 at 10:30

Community

1
1

answered Apr 07 '12 at 18:22

waqaslam

67,549
16
165
178

Sorry Waqas, forgot the backticks when quoting from Android dev site, should read "use a element in the element", fixed now. The method you describe is what I started with, but the shapes scale to fill the parent View which is what I'm trying to avoid :( – ataulm Apr 07 '12 at 18:32
yes, that statement is still valid for using bitmaps with valid src attribute (not referring to xml drawable) as drawable in layer-list. Even in android's developer site, they are using solid images as example. What are you trying to produce? Can you post it as an image? perhaps i can suggest you some other solutions – waqaslam Apr 07 '12 at 18:44
2

the statement is not valid when setting the gravity (of the bitmap) to "center" which will prevent it from scaling. I was hoping to define a series of filled ellipses layered upon one another (in decreasing size) as a background. (Experiment, not final design :P) Will post an image within 10min. – ataulm Apr 07 '12 at 18:47
i guess your best bet would be using the entire image as background or draw the shapes programmatically... – waqaslam Apr 07 '12 at 19:27
1

ah, I had hope this wasn't the case, and that I was just missing something simple - the reason I didn't want to use a flat background image was so I wouldn't have to create lots of background images for different devices. I'll mark this as answered (in that it's not possible) but if anyone can see an alternative, please do post, and I'll update :) Thanks Waqas. – ataulm Apr 07 '12 at 19:31

Preventing shapes scaling in a LayeredList without using Bitmap

1 Answers1

Linked