0

I need to create following design as a drawable, to set it as a background of a button.

Button design

I have already created a drawable with green background and rounded corners, I also have a drawable which is oval with white border, orange background and a white X, but I have no idea how to "put it" on the right top corner of another drawable.

The only result which I've got is this:

Final drawable

Which is absolutely not what I'm searching for. It looks like this in app:

Design in app

I would appreciate any help, thank you! I'm desperate.


SOLUTION:

Thanks to Bö macht Blau and CommonsWare I was able to solve the problem.

Here is a final drawable:

Final drawable

And the drawable code is:

raw_material_button.xml

 <?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/green_button_rounded"
        android:top="10dp"
        android:right="10dp"
        android:bottom="10dp"
        android:left="10dp" />
    <item android:drawable="@drawable/close_raw_material"
        android:height="20dp"
        android:width="20dp"
        android:gravity="end"/>
</layer-list>

green_button_rounded.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/green"/>
    <corners android:radius="5dp" />
</shape>

close_raw_material.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false"
        >
        <shape android:shape="oval">
            <solid android:color="@color/white" />
            <padding android:left="2dp" android:right="2dp" android:top="2dp" android:bottom="2dp" />
        </shape>
    </item>
    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="1dp">
        <shape android:shape="oval">
            <solid android:color="@color/textYellow" />

        </shape>
    </item>
    <item android:right="2dp" android:top="2dp" android:left="2dp" android:bottom="2dp">
        <rotate
            android:fromDegrees="135"
            android:pivotX="50%"
            android:pivotY="50%"
            android:toDegrees="135">
            <shape android:shape="line">
                <stroke android:width="2dp" android:color="@color/white" />
            </shape>
        </rotate>
    </item>
    <item android:right="2dp" android:top="2dp" android:left="2dp" android:bottom="2dp">
        <rotate
            android:fromDegrees="45"
            android:pivotX="50%"
            android:pivotY="50%"
            android:toDegrees="45">
            <shape android:shape="line">
                <stroke android:width="2dp" android:color="@color/white" />
            </shape>
        </rotate>
    </item>
</layer-list>

0 Answers0