Round a corner of a circular progress bar

user_10590692 0
Viewed 1775

I have this circular progress bar

enter image description here

And I want to round the final corner, so it looks like this

enter image description here

Is possible to do this?

This is my XML for my actual progressbar:

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%"
android:pivotY="50%"
android:fromDegrees="0"
android:toDegrees="360">
<shape
    android:shape="ring"
    android:innerRadiusRatio="3"
    android:thicknessRatio="9"
    android:useLevel="false">

<gradient
    android:type="sweep"
    android:startColor="@android:color/holo_orange_light"
    android:endColor="@android:color/holo_red_light" />

</shape>

</rotate>

And my ProgresBar:

<ProgressBar
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:indeterminateDrawable="@drawable/progress"/>

I have seen how it is done with HorizontalProgressBar but not with CircularProgressBar, is it possible to do this effect? How is it done?

I tried this but doesn't works https://stackoverflow.com/a/53830379/7271027

android-progressbar android xml
2 Answers

You have to extend you drawable in a way like this:

<?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="4dp"
                android:useLevel="true">
                <solid android:color="@color/yourcolor" />
            </shape>
        </rotate>
    </item>
    <item android:bottom="261dp">
        <shape
            android:innerRadiusRatio="100000"
            android:shape="ring"
            android:thickness="2dp"
            android:useLevel="false">
            <solid android:color="@color/yourcolor" />
        </shape>
    </item>
    <item>
        <rotate>
            <inset android:insetBottom="261dp">
                <shape
                    android:innerRadiusRatio="100000"
                    android:shape="ring"
                    android:thickness="2dp"
                    android:useLevel="false">
                    <solid android:color="@color/yourcolor" />
                </shape>
            </inset>
        </rotate>
    </item>
</layer-list>

In that way you just put a dot on the ring. Surely you have to fine tune the radius and thickness.

user_124091330
user_105906920
Related