Android Progress Bar
The progress bar in android plays a vital role in displaying the progress of any task initiated by our app. It helps the users get updated with the part of the completed task, and how much part is left out.
When you download files, you see how much portion is downloaded and how much more is left in a general scenario. Just imagine what if no progress was shown to you. You would feel that the file might not be downloading and click on download again.
To stop such confusion and make it more user-friendly, you should provide Progress bars to update the progress of your task.
About Progress Bar in Android
A progress bar is an Android UI element that helps to show the progress of various tasks. Progress bars are helpful to update users about the progress of an ongoing task. It even provides you with features to restrict or refrain users from performing other tasks.
For example, suppose a new user visits your app, and you need to register him before allowing him to use the app. So, while you validate his data, you should show him a progress bar indicating that his information is getting validated.
It’s not just for registering or updating details where Progress Bars are used. You can also use it to show the progress of downloading files, uploading files, and fetching data from the server. Android Progress Bar automatically terminates when the process accomplishes.
Creating Progress Bar in Android is relatively easy, and you can do it by pasting the below code in your XML file and Kotlin File.
XML Code:
<ProgressBar
android:id="@+id/spinner_progress_Bar"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:indeterminate = "true"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
Kotlin Code:
Attributes of a Progress Bar
You can apply several attributes to your progress bars to style or add more functionalities to them.
| Attribute Name | Description |
| android:progress | The “progress” attribute is used to set the default value for your progress bar, between 0 and max. |
| android:progressDrawable | The “progressDrawable” attribute is used to define a drawable object for the progress bar. |
| android:min | The “min” attribute is used to set the lower bound of your progress bar. |
| android:max | The “max” attribute is used to specify the upper bound of your progress bar. |
| android:maxHeight | The “maxHeight” is used to set the maximum height your progress bar can attain. |
| android:maxWidth | The “maxWidth” is used to set the maximum width your progress bar can attain. |
| android:interpolator | The “interpolator” sets a curve for indeterminate animation. |
| android:animationResolution | The “animationResolution” is used to set the time gap in milliseconds between the frames of the animations. |
| android:id | The “id” attribute is used to identify your created progress bars uniquely. |
| android:indeterminate | The “indeterminate” mode is used to set the mode of your progress bar to indeterminate. |
Methods involved in Progress Bar
There are several methods that you can use depending on your requirements while implementing Progress Bars. Some of the crucial methods that are usually used are shown below, along with their purpose.
| Method Name | Purpose of the Method |
| setIndeterminate(indeterminate: Boolean) | The “setIndeterminate()” method is used to set or unset the indeterminate mode for a progress bar. |
| setMax(max: Int) | The “setMax()” method is used to set the upper bound of your progress bar. |
| setMin(min: Int) | The “setMin()” method is used to set the lower bound of your progress bar. |
| setProgress(progress: Int) | The “setProgress()” method is used to specify the current progress level of your progress bar. |
| setProgressDrawable(d: Drawable!) | The “setProgressDrawable()” method is used to set the drawable for your progress bar. |
| isAnimating() | The “isAnimating()” provides you with the info on whether or not your progress bar is animating. |
| getProgress() | The “getProgress()” method provides you with the current progress of your progress bar. |
| getMaxHeight() | The “getMaxHeight()” provides you the maximum height that your progress bar can attain. |
| getMaxWidth() | The “getMaxWidth()” provides you the maximum width that your progress bar can attain. |
| getMax() | The “getMax()” method returns you the upper bound value, which the progress can achieve. |
| getMin() | The “getMin()” method returns you the lower bound value the progress bar can achieve. |
Types of Progress Bar in Android
In Android, the progress bar may be divided into two categories:
- Spin Wheel Progress Bar
- Horizontal Progress Bar
Spin Wheel Progress Bar
Spin Wheel Progress Bar consists of the circular wheel-like progress, which keeps on rotating until and unless your task accomplishes. It’s also the default Progress Bar for android and can be created by using the following code.
<ProgressBar
android:id="@+id/spinner_progress_Bar"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:indeterminate = "true"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
Horizontal Progress Bar
The horizontal Progress bar is usually rectangular in shape and shows the progress from left to right. To change the default progress bar to horizontal, you can use the below code.
<ProgressBar style="?android:attr/progressBarStyleHorizontal" />
The horizontal progress bar is of two types, as shown below:
1. Determinate Horizontal Progress Bar
The determinate horizontal progress bar is used when you wish to show the actual progress to the user. Using this progress bar, you can showcase the actual portion of the completed task and how much is left.
To use this, you need to set the indeterminate attribute to false as follows:
android:indeterminate = "false"
The full declaration of your Determinate Horizontal Progress Bar goes as follows:
<ProgressBar
android:id="@+id/determinate_progress_Bar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="100dp"
android:indeterminate = "false"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
2. Indeterminate Horizontal Progress Bar
The indeterminate horizontal progress bar is a standard progress bar where the user doesn’t know the actual progress. To use this, you need to set the indeterminate attribute to true as follows:
android:indeterminate = "true"
The full declaration of your Indeterminate Horizontal Progress Bar goes as follows:
<ProgressBar
android:id="@+id/horizontal_progress_Bar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="100dp"
android:indeterminate = "true"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
The first progress bar is the spinner type in the above screenshot, while the other two are horizontal progress bars. The second progress bar is the indeterminate horizontal progress bar, whereas the third one is the determinate horizontal progress bar.
Implementation of Progress Bar in Android
Now, let’s see each of the above-discussed Progress bars live through an android application. To implement the Progress bars in your android applications, you need to follow the below stated steps.
1: Start your Android Studio and click on Create a New Project.
2: Go to your activity_main.xml file and paste the below code there.
Code: activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ProgressBar
android:id="@+id/spinner_progress_Bar"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="100dp"
android:indeterminate = "true"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
<ProgressBar
android:id="@+id/horizontal_progress_Bar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="100dp"
android:indeterminate = "true"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
<ProgressBar
android:id="@+id/determinate_progress_Bar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="100dp"
android:indeterminate = "false"
android:max="100"
android:minWidth="100dp"
android:minHeight="50dp"
android:progress="0" />
<TextView
android:id="@+id/text_view"
android:layout_width="match_parent"
android:gravity="center"
android:textColor="#4CAF50"
android:textSize="22sp"
android:layout_height="wrap_content" />
<Button
android:id="@+id/show_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:layout_gravity="center"
android:text="Progress Bar" />
</LinearLayout>
3: Now, open your MainActivity.kt file and add the below code there.
Code: MainActivity.kt
package com.techvidvan.techvidvanprogressbar
import android.annotation.SuppressLint
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.ProgressBar
import android.widget.TextView
import android.os.Handler
class MainActivity : AppCompatActivity()
{
//declaring variables
private lateinit var progressBar1: ProgressBar
private lateinit var progressBar2: ProgressBar
private lateinit var progressBar3: ProgressBar
private var i = 0
private var j = 0
private var k = 0
private var txtView: TextView? = null
private val handler = Handler()
private lateinit var progbtn:Button
@SuppressLint("SetTextI18n")
override fun onCreate(savedInstanceState: Bundle?)
{
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
//binding views with variables
progressBar1 = findViewById(R.id.spinner_progress_Bar)
progressBar2 = findViewById(R.id.horizontal_progress_Bar)
progressBar3 = findViewById(R.id.determinate_progress_Bar)
txtView = findViewById(R.id.text_view)
progbtn = findViewById(R.id.show_button)
progbtn.setOnClickListener {
//When the user presses the progress bar button then
//we will fetch the progress in some variables.
i = progressBar1.progress
j = progressBar2.progress
k = progressBar3.progress
//Run a thread and update the progress of your progress bars
Thread(Runnable {
while (i < 100) {
i += 2
j += 2
k += 2
handler.post(Runnable {
progressBar1.progress = i
progressBar2.progress = j
progressBar3.progress = k
//Display the current progress in the text view
txtView!!.text = "[ Downloading Files: " +i.toString() + "/" + progressBar1.max +" ]"
})
try {
Thread.sleep(100)
} catch (e: InterruptedException) {
e.printStackTrace()
}
}
}).start()
}
}
}
Now, simply run your application on your actual device or emulator and see the output.
Summary
So, through this article, you came across another exciting topic called Progress Bars in Android. You came across the need for Progress Bars and how it can be helpful to keep your users updated about the progress of tasks. Later on, you saw the several methods and attributes of Progress Bar. Finally, you saw the two types of the Progress bar and saw their implementation too.