ProgressBars 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 look at How to use the ProgressBar in android. A sample video is given below to get an idea about what we are going to do in this article.
Note: This Android article covered in both Java and Kotlin languages.
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.
Step 2: Working with the activity_main.xml file
Navigate to app > res > layout > activity_main.xml and add the below code to it. Comments are added in the code to get to know in detail.
<? xml version = "1.0" encoding = "utf-8" ?>
< RelativeLayout android:id = "@+id/idRLContainer"
android:layout_width = "match_parent"
android:layout_height = "match_parent"
android:orientation = "vertical"
tools:context = ".MainActivity" >
<!--on below line we are creating
a text for our app-->
< TextView
android:id = "@+id/idTVHeading"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:layout_above = "@id/idPBLoading"
android:layout_centerInParent = "true"
android:layout_margin = "20dp"
android:gravity = "center"
android:padding = "10dp"
android:text = "Progress Bar in Android"
android:textAlignment = "center"
android:textColor = "@color/black"
android:textSize = "20sp"
android:textStyle = "bold" />
<!--on below line we are creating a progress bar-->
< ProgressBar
android:id = "@+id/idPBLoading"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:layout_above = "@id/idBtnDisplayProgress"
android:layout_centerHorizontal = "true"
android:layout_margin = "20dp"
android:visibility = "gone" />
<!--on below line we are creating a button-->
< Button
android:id = "@+id/idBtnDisplayProgress"
android:layout_width = "match_parent"
android:layout_height = "wrap_content"
android:layout_centerInParent = "true"
android:layout_margin = "20dp"
android:text = "Show Progress Bar"
android:textAllCaps = "false" />
</ RelativeLayout >
|
Step 3: Working with the MainActivity file
Navigate to app > java > your app’s package name > MainActivity file and add the code below. Comments are added in the code to get to know in detail.
package com.gtappdevelopers.kotlingfgproject
import android.os.Bundle
import android.view.View
import android.widget.Button
import android.widget.ProgressBar
import androidx.appcompat.app.AppCompatActivity
class MainActivity : AppCompatActivity() {
// on below line we are creating a variable.
lateinit var showProgressBtn: Button
lateinit var loadingPB: ProgressBar
var isProgressVisible = false
override fun onCreate(savedInstanceState: Bundle?) {
super .onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// on below line we are initializing our variables.
showProgressBtn = findViewById(R.id.idBtnDisplayProgress)
loadingPB = findViewById(R.id.idPBLoading)
// on below line we are adding
// click listener for our button
showProgressBtn.setOnClickListener {
// on below line we are checking
// if progress bar is already visible.
if (isProgressVisible) {
// if it is visible we are
// updating text for our button.
showProgressBtn.text = "Show Progress Bar"
// on below line we are changing
// its visibility
loadingPB.visibility = View.GONE
// on below line we are updating
// is progress visible to false
isProgressVisible = false
} else {
// this condition will be called
// if progress bar visibility is gone
isProgressVisible = true
// on below line we are updating text for our button.
showProgressBtn.text = "Hide Progress Bar"
// on below line we are changing
// visibility for our progress bar.
loadingPB.visibility = View.VISIBLE
}
}
}
} |
package com.gtappdevelopers.kotlingfgproject;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ProgressBar;
import androidx.appcompat.app.AppCompatActivity;
public class MainActivity2 extends AppCompatActivity {
// on below line we are creating a variable.
private Button showProgressBtn;
private ProgressBar loadingPB;
boolean isProgressVisible = false ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super .onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// on below line we are initializing variables with ids.
showProgressBtn = findViewById(R.id.idBtnDisplayProgress);
loadingPB = findViewById(R.id.idPBLoading);
// on below line we are adding click listener for our button
showProgressBtn.setOnClickListener( new View.OnClickListener() {
@Override
public void onClick(View v) {
// on below line we are checking if
// progress bar is already visible.
if (isProgressVisible) {
// if it is visible we are
// updating text for our button.
showProgressBtn.setText( "Show Progress Bar" );
// on below line we are changing
// its visibility
loadingPB.setVisibility(View.GONE);
// on below line we are updating
// is progress visible to false
isProgressVisible = false ;
} else {
// this condition will be called if
// progress bar visibility is gone
isProgressVisible = true ;
// on below line we are updating
// text for our button.
showProgressBtn.setText( "Hide Progress Bar" );
// on below line we are changing
// visibility for our progress bar.
loadingPB.setVisibility(View.VISIBLE);
}
}
});
}
} |
Now run your application to see the output of it.
Output: