Nested shapes in Android

android, android-shape, shapes, xamarin.android

Solution

If you're going to look into using multiple shapes, you should try a LayerListDrawable. Something like this works for me, but only for your example height of 60px. You may have to modify it to suit your needs exactly, but this should get you a good start:

<?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:angle="270"
            android:endColor="#ff16c0e3"
            android:startColor="#ff297baf"
            android:type="linear" />
    </shape>
</item>
<item android:top="57px">
    <shape android:shape="rectangle">
        <solid android:color="#FFFFFFFF" />
        <size android:height="3px" />
    </shape>
</item>

Problem

I am trying to draw a shape that has three rectangular shapes: - solid color - gradient - white line How do I do that? When I try this, it does not work. The layout has the parent color. ``` <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" android:height="60px" > <shape android:shape="rectangle" android:height="30px" > <solid android:color="#ff297baf" /> </shape> <shape android:shape="rectangle" android:height="30px" > <gradient android:type="linear" android:startColor="#ff297baf" android:endColor="#ff16c0e3" android:angle="270"/> </shape> <shape android:shape="rectangle" android:height="3px" > <solid android:color="#FFFFFFFF" /> </shape> </shape> ``` I am trying to make a gradient in 3 colors. Start with a solid color `#ff297baf`, at 60% start a gradient from `#ff297baf` to `#ff16c0e3` and add a while line at the end.

Original source