How to make progressbar progress rounded from edge?

Question

I am making custom progressbar with round shape and gradient color. I achieved it but making it rounded from edges is not working.

This is my progressbar

  <ProgressBar
        android:id="@+id/progress1"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:indeterminate="false"
        android:max="100"
        android:progress="80"
        android:progressDrawable="@drawable/bg_progressbar_1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

And here is the drawable

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item android:id="@android:id/progress"
    android:top="2dp"
    android:bottom="2dp"
    android:left="2dp"
    android:right="2dp">
    <rotate
        android:fromDegrees="90"
        android:toDegrees="90"
        android:pivotX="50%"
        android:pivotY="50%" >
        <shape
            android:innerRadiusRatio="3"
            android:shape="ring"
            android:thickness="15dp" >
            <gradient
                android:centerColor="#e62a77"
                android:endColor="#d5302a"
                android:startColor="#ff006d"
                android:type="sweep" />
            <corners android:radius="8dp"/>
        </shape>
    </rotate>
</item>

I used <corners android:radius="8dp"/> still it's not working.

[This](https://stackoverflow.com/questions/31219455/android-round-edges-on-ring-shaped-progressbar) May help .. — ADM, Feb 21 '20 at 05:33

Vir Rajpurohit · Answer 1 · 2020-02-21T06:32:08.173

Please try below code

    <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate android:fromDegrees="270" android:toDegrees="270">
            <shape
                android:innerRadiusRatio="2.55"
                android:shape="ring"
                android:thickness="15dp"
                android:useLevel="true">
                <gradient
                    android:centerColor="#e62a77"
                    android:endColor="#d5302a"
                    android:startColor="#ff006d"
                    android:type="sweep" />
            </shape>
        </rotate>
    </item>
    <item android:bottom="211dp">
        <shape
            android:innerRadiusRatio="1000"
            android:shape="ring"
            android:thickness="7dp"
            android:useLevel="false">
            <solid android:color="#ff006d" />
        </shape>
    </item>
    <item>
        <rotate>
            <inset android:insetBottom="211dp">
                <shape
                    android:innerRadiusRatio="1000"
                    android:shape="ring"
                    android:thickness="7dp"
                    android:useLevel="false">
                    <solid android:color="#d5302a" />
                </shape>
            </inset>
        </rotate>
    </item>
</layer-list>

Reference: https://stackoverflow.com/a/56905735/6997819

It uses three items

1) Circle at starting point

2) Circle that moves along progress

3) The main progress route

Check result Image

nope it doesn't work. dot on start and end not align properly. I cannot assign fix dp for android:bottom and android:insetBottom — Ajay Gohel, Feb 21 '20 at 06:12
Somewhere you have to fix that. As per your layout requirement you can make changes accordingly — Vir Rajpurohit, Feb 21 '20 at 06:23
Ok adjusted , but what about color? i used gradient color for secondary progress and we are providing solid color for dots. It mismatch on different progress — Ajay Gohel, Feb 21 '20 at 08:12

How to make progressbar progress rounded from edge?

1 Answers1