I am trying to figure out, by the Zeplin characteristics showed below, how exactly can I create the following drawable
Zeplin characteristics:
I know that to achieve this I need a layer list with a oval solid shape and a ring with a fading gradient. What I don't understand is how I can achieve this in a concrete way and how can I translate those outer shadows mentioned there into drawable code. I managed to achieve this somehow, but the 'technique' is not quite okay, plus it only works for that 145dpx145dp ImageView dimension, if I try to use it for another dimension it does not fit well. Notice that I had to add multiple layers for ring, because only one would be to faded out, I figured that the bigger the dimension, the more the color would be washed out at the start of the ring
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:innerRadius="20dp"
android:shape="ring"
android:thickness="7dp"
android:useLevel="false">
<gradient
android:centerColor="@color/azure"
android:endColor="@color/azure_0"
android:gradientRadius="24.5dp"
android:startColor="@color/azure"
android:type="radial" />
</shape>
</item>
<item>
<shape
android:innerRadius="20dp"
android:shape="ring"
android:thickness="7dp"
android:useLevel="false">
<gradient
android:centerColor="@color/azure"
android:endColor="@color/azure_0"
android:gradientRadius="24.5dp"
android:startColor="@color/azure"
android:type="radial" />
</shape>
</item>
<item
android:width="40dp"
android:height="40dp"
android:left="3.5dp"
android:top="3.5dp">
<shape android:shape="oval">
<gradient
android:endColor="@color/slate_grey"
android:startColor="@color/charcoal_grey_three"
android:type="linear" />
</shape>
</item>
Is there a more elegant way to achieve this and be able to use it on multiple View dimensions or can someone please explain to me how to interpret those Shadows?