Customizing Progress Bar In Android

Customizing Progress Bar In Android

Progress Bar:
                                               Progress bars are used to show progress of a task. For example. When you are uploading or downloading something from the internet, it is better to show the progress of download/upload to the user.Now here am going to customize the  progress bar

How to customize the progress bar?
                                To customize the progress bar we need to define the properties of progress bar which are defined in  the xml file inside the drawable folder.


1.Open Eclipse IDE.
2.Click File -> New -> Project -> Android Application Project.
3.Enter the name of the application  as CustomizedProgressbar and click next .
4.Make sure that you have enabled the create project in workspace.
5.Design application launcher icon and create a blank activity workspace and click finish 
6.Create a folder drawable inside the res folder
7.Create a custom_progressbar.xml inside the drawable folder

The custom_progressbar.xml coding is given below:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

<!-- Define the background properties like color etc -->

<item android:id="@android:id/background">

<shape>

<gradient

android:angle="270"

android:centerColor="#0b131e"

android:centerY="1.0"

android:endColor="#0d1522"

android:startColor="#000001" />

</shape>

</item>

<!-- Define the progress properties like start color, end color etc -->

<item android:id="@android:id/progress">

<clip>

<shape>

<gradient

android:angle="270"

android:centerColor="#007A00"

android:centerY="1.0"

android:endColor="#06101d"

android:startColor="#007A00" />

</shape>

</clip>

</item>

</layer-list>

The activity_main.xml code is given below:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:background="#B4E0E1"

android:layout_width="match_parent"

android:layout_height="match_parent" >

<TextView

android:id="@+id/textView1"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:gravity="center"

android:layout_marginTop="80dp"

android:text="CustomizedProgressbar"

android:textAppearance="?android:attr/textAppearanceLarge"/>

<Button

android:id="@+id/button1"

android:layout_marginTop="150dp"

android:background="@drawable/button"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:text="Start Downloading File"

android:onClick="startProgressDialog"/>

</RelativeLayout>

The activity_main.xml looks as shown below:

                                                                               

The MainActivity java as shown below :

package com.example.customizedprogressbar;


import android.support.v7.app.ActionBarActivity;
import android.app.ProgressDialog;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.os.Handler;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;


public class MainActivity extends ActionBarActivity
{


ProgressDialog progressBar;
private int progressBarStatus = 0;
private Handler progressBarHandler = new Handler();


private long fileSize = 0;

@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}


public void startProgressDialog(View V)
{



// prepare for a progress bar dialog
progressBar = new ProgressDialog(V.getContext());
progressBar.setCancelable(true);
progressBar.setMessage("Downloading File...");
progressBar.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
progressBar.setProgress(0);
progressBar.setMax(100);

// Get the Drawable custom_progressbar
Drawable customDrawable= getResources().getDrawable(R.drawable.custom_progressbar);

// set the drawable as progress drawable


progressBar.setProgressDrawable(customDrawable);

progressBar.show();


//reset progress bar status
progressBarStatus = 0;


//reset filesize
fileSize = 0;


new Thread(new Runnable() {
public void run() {
while (progressBarStatus < 100) {


// process some tasks
progressBarStatus = fileDownloadStatus();


// sleep 1 second to show the progress
try {
Thread.sleep(1000);
}
catch (InterruptedException e) {
e.printStackTrace();
}


// Update the progress bar
progressBarHandler.post(new Runnable() {
public void run() {
progressBar.setProgress(progressBarStatus);
}
});
}


// when, file is downloaded 100%,
if (progressBarStatus >= 100) {


// sleep for 2 seconds, so that you can see the 100% of file download
try {
Thread.sleep(2000);
} catch (InterruptedException e) {
e.printStackTrace();
}


// close the progress bar dialog
progressBar.dismiss();
}
}
}).start();


}





//method returns the % of file downloaded
public int fileDownloadStatus()
{


while (fileSize <= 1000000) {


fileSize++;


if (fileSize == 100000) {
return 10;
} else if (fileSize == 200000) {
return 20;
} else if (fileSize == 300000) {
return 30;
}
else if (fileSize == 400000) {
return 40;
} else if (fileSize == 500000) {
return 50;
} else if (fileSize == 600000) {
return 60;
}
// write your code here


}


return 100;


}
}

Now Run the project and check the result  ,the result will shown as below.
                                           
                                                                 

Download Sourcecode