Search code examples
androidandroid-drawableradial-gradients

android create pie dount with gradient


Is there any way to create circle with gradient like this ?

enter image description here

As far as i get is this:

<shape
       android:innerRadiusRatio="3"
       android:thicknessRatio="10"
       android:shape="ring">
     <gradient
               android:endColor="@color/cyan_dark"
               android:startColor="@color/red"
               android:type="radial"
               android:gradientRadius="340"
               android:centerX="50%"
               android:centerY="0" />
</shape>

Solution

  • XML

    <ProgressBar
            android:id="@+id/yourId"
            style="?android:attr/progressBarStyleHorizontal"
            android:layout_width="89dp"
            android:layout_height="89dp"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:max="100"
            android:progress="70"
            android:progressDrawable="@drawable/shapering" />
    

    shapering drawable

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:innerRadiusRatio="3"
        android:shape="ring"
        android:thicknessRatio="10" >
    
        <gradient
            android:centerColor="#D6DE47"
            android:centerX="50%"
            android:centerY="0"
            android:endColor="#DE47A7"
            android:gradientRadius="340"
            android:startColor="#6D47DE"
            android:type="sweep" />
    
    </shape>
    

    Result

    enter image description here