Develop Reference

How to define gradient to circular progressBar

I have added a progress bar like following in my layout, i also added a color to it, and it works fine.
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyle"
android:layout_width="50dp"
android:layout_height="50dp"
android:indeterminate="true"
android:indeterminateTintMode="src_atop"
android:indeterminateTint="#color/color"
android:layout_gravity="center_vertical|center_horizontal"
android:visibility="visible"
/>
But i need to add a gradient color on it. I added a gradient in colors folder like following.
<gradient android:type="linear"
android:angle="0"
android:startColor="#dc0336"
android:endColor="#ff7f00"
xmlns:android="http://schemas.android.com/apk/res/android" />
and then i assigned this color to the Progressbar
android:indeterminateTint="#color/gradientColor"
But this does not work, I need to know a way to add a gradient to the progressBar

This is a late answer but I think this will help other people. Just Try Following the code.
drawable/loading_progressbar
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="1440">
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="10"
android:useLevel="false">
<size
android:width="60dp"
android:height="60dp" />
<gradient
android:centerColor="#b43787"
android:centerY="0.50"
android:endColor="#7036a3"
android:startColor="#f0376f"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
activity_main.xml
<ProgressBar
android:id="#+id/loading_progress"
android:layout_width="130dp"
android:layout_height="130dp"
android:indeterminateDrawable="#drawable/loading_progressbar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
Result

You should use android:progressDrawable instead of android:indeterminateTint.
Your code should look like below:
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="50dp"
android:layout_height="50dp"
android:indeterminate="true"
android:indeterminateTintMode="src_atop"
android:progressDrawable="#drawable/gradientDrawable"
android:layout_gravity="center_vertical|center_horizontal"
android:visibility="visible"
/>
Use the following as your gradient Drawable. Name the file as gradientDrawable.xml and place it under your drawable directory.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadiusRatio="3.5"
android:shape="ring"
android:thickness="2.5dp"
android:useLevel="false">
<gradient
android:angle="0"
android:endColor="#ff7f00"
android:startColor="#dc0336"
android:type="linear" />
</shape>
I have tested your gradient and it looked like this:

You can set gradient background to progress-bar as below:
<ProgressBar
android:layout_width="75dp"
android:layout_height="75dp"
**android:progressDrawable="#drawable/circular"** />
**circular.xml**
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="ring"
android:thicknessRatio="10"
android:useLevel="false">
<solid android:color="#FA969C" />
</shape>
</item>
<item>
<rotate
android:fromDegrees="270"
android:toDegrees="270">
<shape
android:shape="ring"
android:thicknessRatio="10"
android:useLevel="true">
<gradient
android:centerColor="#CC3037"
android:endColor="#ED4A52"
android:startColor="#A11210"
android:type="sweep" />
</shape>
</rotate>
</item>
</layer-list>

Improve progress-bar view

I have a progress bar, that I show to the user until loading is complete. It's good but there is a white rectangle in the middle of the layout, which I want to remove.
I want only the rotating ProgressBar in the middle of the layout.
How to remove this white rectangle?
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent">
<ProgressBar
android:id="#+id/progress_bar"
android:paddingTop="5sp"
android:paddingBottom="5sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:indeterminateDrawable="#drawable/progress_bar"
android:max="100"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
and this the progress_bar drawable
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="200"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="1080" >
<shape
android:innerRadius="18dp"
android:shape="ring"
android:thickness="4dp"
android:useLevel="false" >
<size
android:height="48dp"
android:width="48dp" />
<gradient
android:centerColor="#color/colorPrimary"
android:endColor="#ffffff"
android:startColor="#color/colorPrimary"
android:centerY="0.5"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>

How to create a custom ProgressBar with drawables, without programming?

This is my custom white-transparent wheel ProgressBar
progressbar_circle.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadiusRatio="2.5"
android:thickness="4dp"
android:useLevel="false">
<gradient
android:type="sweep"
android:startColor="#android:color/white"
android:centerColor="#android:color/white"
android:endColor="#android:color/transparent"
/>
</shape>
In the preview window of Android studio, this element has showed correctly.
But after debug testing in both emulator (Android 9) and device (Android 6), ProgressBar showed as #color/colorAccent wheel Progressbar.
I have tried to change android:shape, android:innerRadiusRatio, android:thickness, even change gradient to solid color. Nothing changed.
Here is my progress_task_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="#+id/correct_icon"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:contentDescription="#string/correct_icon"
android:padding="#dimen/padding_large"
android:visibility="gone" />
<ProgressBar
android:id="#+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="8dp"
android:padding="#dimen/padding_large"
android:progressDrawable="#drawable/progressbar_circle"
android:visibility="gone" />
</RelativeLayout>
How to accomplish custom android ProgressBar on xml without dynamically programming in java?

Create progress.xml file in drawable folder:
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="360">
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="8"
android:useLevel="false">
<size
android:width="76dip"
android:height="76dip" />
<gradient
android:angle="0"
android:endColor="#1672B6"
android:startColor="#android:color/transparent"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
Then use it like this:
<ProgressBar
android:id="#+id/pbarLoading"
android:layout_width="36dp"
android:layout_height="36dp"
android:indeterminateDrawable="#drawable/progress"/>

How to make ProgressBar of style large Thinner in width android?

I have the mic icon and surrounding the mic icon, I need to place the Progress Bar to handle some running process like below:
<ImageView
android:id="#+id/iv_mic_movable"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="68dp"
android:src="#drawable/record" />
<ProgressBar
android:id="#+id/pb_assist"
style="?android:attr/progressBarStyleLarge"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="53dp"
android:visibility="gone" />
The above code shows the UI as follows:
I want to show the progress bar like this, But this progress is very Thick. How to make it somewhat thinner with only 1dp?

None of the above answers worked for me. Struggling around found a below working solution.
progressbar_circular.xml. Use android:thicknessRatio for thickness of the circle. More the value will be, thinner it will be.
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="0"
android:toDegrees="360" >
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="40"
android:useLevel="false" >
<size
android:height="48dip"
android:width="48dip" />
<gradient
android:centerColor="#color/colorPrimary"
android:centerY="0.50"
android:endColor="#color/color_black"
android:startColor="#color/colorPrimary"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
Progress bar layout will be like below:
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="?android:attr/progressBarStyleLarge"
android:indeterminateDrawable="#drawable/progressbar_circular"
android:layout_gravity="center_horizontal"
android:visibility="visible"/>

Here is custom ProgressBar. You can set thickness of progress inside shape.
<ProgressBar
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="172dp"
android:layout_height="172dp"
android:indeterminate="false"
android:max="100"
android:visibility="visible"
android:progress="0"
android:layout_gravity="center_horizontal" //updated line
android:layout_marginTop="53dp" //updated line
android:background="#drawable/circle_shape"
android:progressDrawable="#drawable/circle_progress_foreground"
/>
circle_shape.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadiusRatio="2.2"
android:thickness="5dp"
android:useLevel="false">
<solid android:color="#ABBAC2" />
</shape>
circle_progress_foreground.xml
Change android:thickness as per your requirement
<?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.7"
android:shape="ring"
android:thickness="2dp"
android:useLevel="true">
<solid android:color="#fbcb09" />
</shape>
</rotate>

You can also achieve this by adding mimimum width and height
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="23dp"
android:layout_marginTop="20dp"
android:indeterminate="false"
android:max="100"
android:minHeight="5dp"
android:minWidth="200dp"
android:progress="1" />

try to add this below style on your xml progessBar layout,
style="#android:style/Widget.ProgressBar.Large.Inverse"
Update
try to add this property:
android:progressDrawable="#android:drawable/progress_horizontal"

How can I do that circular countdown go with the clockwise?

I have a circular progressbar that is a countdown. The countdown starts at the top of the circular progressbar that's is fine, but go to the left doing the countdown. That I want is the rotation of the countdown go to the right, like the clockwise.
My circle_progress_foreground.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="#android:id/progress">
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="30"
android:useLevel="true">
<gradient
android:startColor="#color/circle_progress_two"
android:endColor="#color/circle_progress"
android:type="sweep" />
</shape>
</item>
</layer-list>
The progressbar in my layout
<ProgressBar
android:id="#+id/progressbar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="280dip"
android:layout_height="290dip"
android:indeterminate="false"
android:progressDrawable="#drawable/circle_progress_foreground"
android:background="#drawable/circle_shape"
android:max="100"
android:rotation="-90"
android:layout_alignParentTop="true"
android:layout_alignLeft="#+id/progressBar"
android:layout_alignStart="#+id/progressBar"
android:layout_centerHorizontal="false"
android:layout_centerInParent="false"
android:layout_centerVertical="false" />
The code in my class:
mProgressBar = (ProgressBar) findViewById(R.id.progressbar);

Try this way to to set your rotation
circle_progress_foreground.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="1dp"
android:useLevel="true">
<gradient
android:angle="0"
android:endColor="#007DD6"
android:startColor="#007DD6"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
circle_shape
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadiusRatio="2.5"
android:thickness="1dp"
android:useLevel="false">
<solid android:color="#CCC" />
</shape>
ProgressBar
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="200dp"
android:layout_height="200dp"
android:indeterminate="false"
android:progressDrawable="#drawable/circle_progress_foreground"
android:background="#drawable/circle_shape"
style="?android:attr/progressBarStyleHorizontal"
android:max="100"
android:progress="65" />