CODEWITHSUNDEEP
androidkotlindrawable
FailedUnitTest
FailedUnitTest

Reputation: 1800

layer-list shapes off screen

I am trying to create a drawable, where I have 3 circles (on top of each other) on a linear gradient and the circles are shifted 50% to the left.

This is my attempt so far:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:startColor="#4833A6"
                android:endColor="#1E479C"
                android:type="linear"
                />
        </shape>
    </item>
    <item android:left="-115dp">
        <shape android:shape="oval">
            <size android:width="230dp" android:height="233dp"/>
            <solid android:color="#1AFFFFFF"/>
        </shape>
    </item>
    <item android:left="-83dp">
        <shape android:shape="oval">
            <size android:width="166dp" android:height="166dp"/>
            <solid android:color="#1AFFFFFF"/>
        </shape>
    </item>
    <item android:left="-57.5dp">
        <shape android:shape="oval">
            <size android:width="115dp" android:height="115dp"/>
            <solid android:color="#1AFFFFFF"/>
        </shape>
    </item>
</layer-list>

The desired effect:

enter image description here

What I have so far :(

enter image description here

What am I doing wrong?

Upvotes: 3

Views: 114

Answers (1)

Raphael Rodrigues
Raphael Rodrigues

Reputation: 41

Try to put in your item, the following:

<item 
    android:width="115dp"
    android:height="115dp"
    android:gravity="center|left"
    android:left="-57dp">
    <shape android:shape="oval">
        <solid android:color="#1AFFFFFF"/>
    </shape>
</item>

Don't define the size inside the shape, but inside the item itself. I tried here, and it's working properly.

Upvotes: 1

Related Questions