Android Progress Bar Example

0

In this article, we will see a basic version of progress bar.

A progress bar is shown to user to indicate the progress of a task that is going to take some time to complete. Obviously one should be able to measure the percentage completed so that the progress is  updated.

In this example we will see how a progress bar can be launched and its progress updated.

Main Layout

The main layout has some text and a download button. On clicking the download, progress bar should show the percentage of task progressed.

welcome.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.javarticles.android.MainActivity" >

    <TextView
        android:id="@+id/welcome"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="78dp"
        android:text="@string/welcome"
        android:textColor="@color/welcome_text_color"
        android:textSize="20sp" />

    <Button
        android:id="@+id/download"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/welcome"
        android:layout_alignTop="@+id/welcome"
        android:layout_marginLeft="61dp"
        android:layout_marginTop="68dp"
        android:text="@string/download" />

</RelativeLayout>

Clicking on download will start progress bar

Clicking on download will start progress bar

How to update Progress Bar’s progress?

ProgressDialog object represents progress dialog. In order to display the progress bar, all you need to do is to create an instance of ProgerssDialog and call show().

ProcessDialog progressDialog = new ProgressDialog();
progressDialog.show();
Empty Process Dialog

Empty Process Dialog

Now let’s set some title.

ProcessDialog progressDialog = new ProgressDialog();
progressDialog.show();
setMessage("Downloading...");
Dialog with message

Dialog with message

Instead of activity circle indicator, we will set the display to horizontal styled bar as our goal is to show the progress.

setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
Horizontal Style Progress Bar

Horizontal Style Progress Bar

When a process is created for your application, its main thread is dedicated to manage the top-level application objects and any windows they create. If you want to update a progress bar’s progress percentage, you can create your own threads, and communicate back with the main application thread through a Handler object by calling handler.post(Runnable) in your new thread.

We will update the progress bar’s progress in a separate thread. Few points to note:

  1. The progress of a progress bar is set using setProgress, the value passed is an integer.
  2. The percentage of progress is measured based on the maximum value set, for example, setMax(100).
  3. One can also set a secondary progress bar which can do calling setSecondaryProgress
  4. The progress is updated using Handler object.
    handler.post(new Runnable() {
    
    				@Override
    				public void run() {
    					setProgress(progress);
    					if (progress == 100) {
    						dismiss();
    					}
    				}
    			});

ProgressDialogExampleActivity:

package com.javarticles.android;

import android.app.Activity;
import android.app.ProgressDialog;
import android.content.Context;
import android.os.Bundle;
import android.os.Handler;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class ProgressDialogExampleActivity extends Activity {
	private Handler handler = new Handler();
	private int progress = 0;
	private int secondaryProgress = 0;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.welcome);
		Button download = (Button) findViewById(R.id.download);
		download.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				final DialogProgressBarRunnable progressDialog = 
						new DialogProgressBarRunnable(v.getContext(), false, 2);
				progressDialog.show();
			}
		});
	}

	private class DialogProgressBarRunnable extends ProgressDialog implements
			Runnable {
		private boolean showSecondary;
		private int incrementAfter;

		public DialogProgressBarRunnable(Context context,
				boolean showSecondary, int incrementAfter) {
			super(context);
			setCancelable(true);
			setMessage(getString(R.string.download_message));
			setSecondaryProgress(0);
			setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
			setMax(100);
			setProgress(0);
			this.showSecondary = showSecondary;
			this.incrementAfter = incrementAfter;
		}
		
		@Override
		public void show() {
			super.show();
			new Thread(this).start();
		}

		@Override
		public void run() {
			while (progress < 100) {
				progress++;
				try {
					Thread.sleep(100);
				} catch (InterruptedException e) {
					e.printStackTrace();
				}
				// increment the first/second progress bar after every %
				progressBar();
			}
		}

		private void progressBar() {
			if (progress % incrementAfter == 0) {
				progressFirstBar();
			}
			if (showSecondary) {
				progressSecondaryBar();
			}
		}

		private void progressSecondaryBar() {
			while (secondaryProgress < 100) {
				secondaryProgress++;
				try {
					Thread.sleep(50);
				} catch (InterruptedException e) {
					e.printStackTrace();
				}
				handler.post(new Runnable() {

					@Override
					public void run() {
						setSecondaryProgress(secondaryProgress);
					}
				});
			}
		}

		private void progressFirstBar() {
			secondaryProgress = 0;
			handler.post(new Runnable() {

				@Override
				public void run() {
					setProgress(progress);
					if (progress == 100) {
						dismiss();
					}
				}
			});
		}
	}
}
Progress Bar Example

Progress Bar Example

Download Source Code

This was an article about Android Progress Dialog Example.
You can download the source code here: optionMenuExample.zip

Share.

Comments are closed.