How to create a custom determinate circular progress dialog with drawable appended to front of progress drawable?

Question

I am trying to create a custom progress dialog that looks like this:

Now I see there are posts like this: How to Customize a Progress Bar In Android

Which is great for creating a simple custom dialog. However I am having trouble attempting to extend their example to append the blue dot on to the end of the progress dialog custom drawable.

How can I go about achieving this effect?

Answer 1

For Progress bar with thumb you can use SeekArc. Please refer below link for SeekArc

https://github.com/neild001/SeekArc

If you only need custom progress bar without thumb then you can use below code.

Using below code you can create the custom circular progress bar without thumb:

In Layout File:

 <ProgressBar
            android:layout_width="300dp"
            android:layout_height="300dp"
            style="?android:attr/progressBarStyleHorizontal"
            android:progressDrawable="@drawable/custom_progressbar"
            android:background="@drawable/custom_progressbar"
            android:max="100"
            android:progress="70"
            android:rotation="180"
            android:layout_centerInParent="true"/>

In Drawable file: custom_progressbar.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="270"
    android:toDegrees="270">
    <shape
        android:innerRadiusRatio="2.5"
        android:shape="ring"
        android:thickness="2dp"
        android:useLevel="true"><!-- this line fixes the issue for lollipop api 21 -->

        <gradient
            android:angle="0"
            android:endColor="@android:color/white"
            android:startColor="@android:color/white"
            android:type="sweep"
            android:useLevel="false" />
    </shape>
</rotate>

The output for above code is: