Search code examples
androidxmlradial-gradients

Ring with gradient in Android


I want to create a ring with gradient which starts from the inner edge of the ring. I tried to do that in this way but then I get a gradient which starts from the center of the ring.

Picture: http://s1.postimg.org/tw5htbxxb/Untitled_1.jpg Left picture shows what I want to do and right picture shows what I get from the following code.

<shape 
    android:shape="ring"
    android:innerRadius="20dp" 
    android:thickness="30dp" >

    <gradient 
        android:type="radial"
        android:gradientRadius="100%p"
        android:startColor="#000000"
        android:endColor="#FFFFFF" />

</shape>

Thanks in advance.


Solution

  • <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
           android:shape="ring"
           android:innerRadiusRatio="4"
           android:thickness="20dp"
           android:useLevel="false" >
        <gradient
            android:centerColor="@android:color/transparent"
            android:centerY="0.50"
            android:endColor="@android:color/holo_green_dark"
            android:startColor="@android:color/transparent"
            android:type="sweep"/>
    </shape>