Custom Progress Bar in Android
Last Updated :
24 Apr, 2025
ProgressBar is generally used for loading a screen in WebView or indicating a user to wait. We can make that progress bar look fancy and this progress bar is mainly used in some of the popular Google apps. It is very convenient and easy to implement. A sample video is given below to get an idea about what we are going to do in this article.
Step-by-Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.
Step 2:
Now Add one implementation in gradle.build(module.app) after that sync it to use custom progressBar
dependencies {
implementation 'com.jpardogo.googleprogressbar:library:1.2.0'
}
Step 3:
Now Create a layout resource file by right-clicking on res > layout make sure the RootElement is RelativeLayout. We are using the layout as progress_bar_1 you can name any.
Â
Step 4:
All The Progress Bar Style That we have used in the above video.
progress_bar_1.xml
Â
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"
xmlns:gbp="http://schemas.android.com/apk/res-auto">
<TextView
android:id="@+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Loading.........."
android:textColor="@color/blue"
android:layout_centerHorizontal="true" />
<com.jpardogo.android.googleprogressbar.library.GoogleProgressBar
android:id="@+id/pg1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="10dp"
android:layout_centerHorizontal="true"
android:layout_below="@id/tv1"
gbp:type="nexus_rotation_cross"/>
</RelativeLayout>
progress_bar_2.xml
Â
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"
xmlns:gbp="http://schemas.android.com/apk/res-auto">
<TextView
android:id="@+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Loading.........."
android:textColor="@color/blue"
android:layout_centerHorizontal="true" />
<com.jpardogo.android.googleprogressbar.library.GoogleProgressBar
android:id="@+id/pg1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="10dp"
android:layout_centerHorizontal="true"
android:layout_below="@id/tv1"
gbp:type="chrome_floating_circles"/>
</RelativeLayout>
progress_bar_3.xml
Â
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"
xmlns:gbp="http://schemas.android.com/apk/res-auto">
<TextView
android:id="@+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Loading.........."
android:textColor="@color/blue"
android:layout_centerHorizontal="true" />
<com.jpardogo.android.googleprogressbar.library.GoogleProgressBar
android:id="@+id/pg1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="10dp"
android:layout_centerHorizontal="true"
android:layout_below="@id/tv1"
gbp:type="google_music_dices"/>
</RelativeLayout>
progress_bar_4.xml
Â
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"
xmlns:gbp="http://schemas.android.com/apk/res-auto">
<TextView
android:id="@+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:text="Loading.........."
android:textColor="@color/blue"
android:layout_centerHorizontal="true" />
<com.jpardogo.android.googleprogressbar.library.GoogleProgressBar
android:id="@+id/pg1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_margin="10dp"
android:layout_centerHorizontal="true"
android:layout_below="@id/tv1"
gbp:type="folding_circles"/>
</RelativeLayout>
Make Sure the layout should be RelativeLayout.
Step 5:Â
We have created a main activity by just assigning 4 buttons and giving unique ids to them. Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file.
XML
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/black"
tools:context=".MainActivity">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="204dp"
android:text="PROGRESS BAR 1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="68dp"
android:text="PROGRESS BAR 2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="64dp"
android:text="PROGRESS BAR 3"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button2" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="96dp"
android:text="PROGRESS BAR 4"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button3" />
</androidx.constraintlayout.widget.ConstraintLayout>
Step 6:
This Is the last step in which with the help of a dialog we'll show all the ProgressBar after user clicks the button by using setOnClickListener, if you're using countdowntimer make sure you implement all the methods by right click > implement methods and add all.
Â
Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.
Java
package com.android.gfgapplication3;
import androidx.appcompat.app.AppCompatActivity;
import android.app.Dialog;
import android.os.Bundle;
import android.os.CountDownTimer;
import android.view.View;
import android.view.Window;
import android.widget.Button;
public class MainActivity extends AppCompatActivity {
Button button, button2, button3, button4;
Dialog dialog;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
button = findViewById(R.id.button);
button2 = findViewById(R.id.button2);
button3 = findViewById(R.id.button3);
button4 = findViewById(R.id.button4);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view)
{
dialog = new Dialog(MainActivity.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.progress_bar_1);
dialog.setCanceledOnTouchOutside(false);
dialog.show();
// added this countdown timer to show the dialog
// for 5 seconds and automically it should disappear
new CountDownTimer(5000, 1000) {
@Override
public void onTick(long l)
{
}
@Override
public void onFinish()
{
dialog.dismiss();
}
}.start();
}
});
button2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view)
{
dialog = new Dialog(MainActivity.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.progress_bar_2);
dialog.setCanceledOnTouchOutside(false);
dialog.show();
new CountDownTimer(5000, 1000) {
@Override
public void onTick(long l)
{
}
@Override
public void onFinish()
{
dialog.dismiss();
}
}.start();
}
});
button3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view)
{
dialog = new Dialog(MainActivity.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.progress_bar_3);
dialog.setCanceledOnTouchOutside(false);
dialog.show();
new CountDownTimer(5000, 1000) {
@Override
public void onTick(long l)
{
}
@Override
public void onFinish()
{
dialog.dismiss();
}
}.start();
}
});
button4.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view)
{
dialog = new Dialog(MainActivity.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.progress_bar_4);
dialog.setCanceledOnTouchOutside(false);
dialog.show();
new CountDownTimer(5000, 1000) {
@Override
public void onTick(long l)
{
}
@Override
public void onFinish()
{
dialog.dismiss();
}
}.start();
}
});
}
}
Output:
Similar Reads
Progress Dialog in Android
In Android, a Progress bar is a UI element used to display the progress of any running task or an operation. An Alert Dialog is a type of alert message displayed over the screen that lets users choose between options to respond to the message of the alert. Both of these elements are different from e
3 min read
ProgressBar in Android
Progress Bar are used as loading indicators in android applications. These are generally used when the application is loading the data from the server or database. There are different types of progress bars used within the android application as loading indicators. In this article, we will take a lo
3 min read
Android Custom Progress Bar using Jetpack Compose
Progress bar in android is used to display the progress of a specific task. There are different types of progress bars that are used within the android applications such as circular progress bar, horizontal progress bar, and many more. In this article, we will take a look at creating a custom horizo
5 min read
Custom Snackbars in Android
A Snackbar in Android is a lightweight and quick way to provide feedback to users about an action which is done by the user. It appears as a temporary, dismissible bar at the bottom of the screen and can contain a message and an optional action button which can easily be removed by the user by just
4 min read
How to Make SpinKit Progress Bar in Android?
In this article Custom Progress Bar in Android, we have discussed some good And captivating Progress Bar that is used in many Google Apps. In this article, we are going to add some more Custom Progress Bar For Android using the Android-SpinKit library. In simpler terms, Progress Bar is a visual repr
4 min read
Custom CheckBox in Android
CheckBox belongs to the android.widget.CheckBox class. Android CheckBox class is the subclass of CompoundButton class. It is generally used in a place where users can select one or more choices from a given list of choices. In this article, we are going to see how we can implement custom CheckBox in
3 min read
Creating Custom SeekBar in Android
SeekBar can be understood as an extension of ProgressBar in Android. You have to just drag the thumb on SeekBar and drag it towards the backward or forward direction and store the current value of progress changed. SeekBar is widely used in different applications ex - Audio player Video Player etc.
5 min read
State ProgressBar in Android
State Progress Bar is one of the main features that we see in many applications. We can get to see this feature in ticket booking apps, educational apps. This progress bar helps to tell the user the steps to be carried out for performing a task. In this article, we are going to see how to implement
3 min read
Bottom Navigation Bar in Android
We all have come across apps that have a Bottom Navigation Bar. Some popular examples include Instagram, WhatsApp, etc. In this article, let's learn how to implement such a functional Bottom Navigation Bar in the Android app. Why do we need a Bottom Navigation Bar? It allows the user to switch to di
6 min read
How to Implement Circular ProgressBar in Android?
ProgressBar is used when we are fetching some data from another source and it takes time, so for the user's satisfaction, we generally display the progress of the task. In this article, we are going to learn how to implement the circular progress bar in an Android application using Java. So, this ar
6 min read