Continuous Progress bar in GXT

GXT as is the case with all toolkits, has a good collection of UI components.
But these components cannot to used out of the box to solve your problems.
One such is the progress bar in the GXT, when I felt a need to use the progress bar to indicate the progress of the operation being performed,
I quickly googled and found some interesting examples . But it involved calculating the amount of work remaining/done to update the progress.
So I wrote this little extension of the progress bar, which I call Continuos Progress bar, it works pretty much like the Windows Vista progress indicator (unlike Ubuntu’s).
Code is small and self explanatory, so I dont want to bother myself explaining the code, and rather save myself time to catch some sleep :)

Code included here is distributed under Apache v2.0 license, so you can freely modifiy, distribute or make commercial use of the code.

class ContinousProgressBar extends ProgressBar {

 private boolean stopProgress = true;
 private Timer timer;

 public ContinousProgressBar() {
 setBounds(10, 10, 200, Style.DEFAULT);
 timer = new Timer() {
 int counter = 0;

 @Override
 public void run() {
 if (stopProgress) {
 updateProgress(10.0, "");
 return;
 }

 if (counter == 10) {
 counter = 0;
 }

 counter++;
 updateProgress(counter / 10.0, "");
 this.schedule(100);
 }
 };

 }

 public void start() {
 if (stopProgress) {
 timer.schedule(100);
 stopProgress = false;
 }
 }

 public void stop() {
 stopProgress = true;
 }

}

This is how it can be used with start/stop button. Below is a sample EntryPoint for the GWT demonstrating the thing.

public class ContinousProgressDemo implements EntryPoint {

 private boolean stopProgress = true;

 public void onModuleLoad2() {

 ContentPanel cp = new ContentPanel();
 cp.setSize(200, 100);

 final ProgressBar bar = new ProgressBar();
 bar.setBounds(10, 10, 200, Style.DEFAULT);
 final Timer timer = new Timer() {
 int val = 0;

 @Override
 public void run() {
 if (stopProgress) {
 bar.updateProgress(10.0, "");
 return;
 }

 if (val == 10) {
 val = 0;
 }

 val++;
 bar.updateProgress(val / 10.0, "");
 this.schedule(100);
 }
 };
 cp.add(bar);

 final ToggleButton toggle = new ToggleButton("Start/Stop");
 toggle.addListener(Events.Toggle, new Listener<ButtonEvent>() {
 @Override
 public void handleEvent(ButtonEvent be) {

 boolean oldState = stopProgress;
 stopProgress = !toggle.isPressed();
 if (oldState && !stopProgress) {
 timer.schedule(100);
 }
 }

 });
 toggle.toggle(false);
 cp.getButtonBar().add(toggle);
 RootPanel.get().add(cp);
 }

 @Override
 public void onModuleLoad() {

 final ContinousProgressBar contProgress = new ContinousProgressBar();

 final ToggleButton toggle = new ToggleButton("Start");
 toggle.addListener(Events.Toggle, new Listener<ButtonEvent>() {
 @Override
 public void handleEvent(ButtonEvent be) {

 if (toggle.isPressed()) {
 toggle.setText("Stop");
 contProgress.start();
 } else {
 toggle.setText("Start");
 contProgress.stop();
 }
 }

 });
 toggle.toggle(false);

 ContentPanel cp = new ContentPanel();
 cp.setHeading("Continuos progressbar");
 cp.setSize(200, 100);
 cp.setFrame(true);
 cp.add(contProgress);
 cp.getButtonBar().add(toggle);

 RootPanel.get().add(cp);
 }
}

Leave a Comment

Filed under GWT, GXT

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s