Progress Indicator Component of the BlackBerry 6.0 OS UI

Progress Indicator Component of the BlackBerry 6.0 OS UI
Page content

Introduction

This component is similar to the Activity Indicator but as I mentioned in the article that dealt with ActivityImageField, this is used when we can calculate how long the activity will take. So we will use a ProgressBarField to indicate that some tasks are going on so as to inform the user how much time they have to wait.

Graphically, this is just a horizontal bar that goes on filling as certain predefined values reach their maximum. When you create your ProgressBar, you can choose between a set of styles:

  • NO_TEXT: it doesn’t display the progress value with the text.
  • PERCENT: showing a percentage of the work done.
  • CURRENT_WITH_MAX: showing the current value and the maximum value in this way “current/max”.

And you can also select the alignment of the text:

  • PROGRESS_TEXT_HCENTER: It centers the text horizontally. This is the default behaviour.
  • PROGRESS_TEXT_LEADING: It aligns the text to the left.
  • PROGRESS_TEXT_TRAILING: It aligns the text to the right.

The code

Let’s deal with the code:

ProgressIndicatorView myview = new ProgressIndicatorView(0);

ProgressIndicatorModel mymodel = new ProgressIndicatorModel(0, 100, 0);

ProgressIndicatorController mycontroller = new ProgressIndicatorController();

In a similar way as we did with the Activity indicator, we have to create the ProgressIndicatorView, ProgressIndicatorModel and ProgressIndicatorController. In the example, the mymodel object is created with 0,100 and 0 values on its constructor’s parameters. The first parameter refers to the initial value of the bar, the second parameter is the maximum value and third parameter is the minimum value.

ProgressThread _customProgressThread;

Then we create a thread. We need a thread controlling the way the bar is updated. This example thread updates the bar every 1000ms (one second).

public ProgressIndicatorBrightHubDemoScreen()

{

setTitle(“This is a progress bar demo for bright hub!!”);

As we also did in the previous example, we have to set the controller to the model, the model and the controller to the view and the model and view to the controller.

mymodel.setController(mycontroller);

myview.setModel(mymodel);

myview.setController(mycontroller);

mycontroller.setModel(mymodel);

mycontroller.setView(myview)

We add a label and create our progressbar with a default style and its text horizontally centered.

view.setLabel(“Percentaje completed”);

view.createProgressBar(Field.FIELD_HCENTER);

add(myview);

Last, we create the Thread and start it.

_ customProgressThread = new ProgressThread();

_ customProgressThread.start();

}

Here is the custom thread we ran before. Please notice this thread does nothing, and it is here where the work which needs to be done is done. This thread just sets the value in the model created before and goes on updating it every second.

class ProgressThread extends Thread

{

public void run()

{

for(int i = 0; i <= 100; ++i)

{

ProgressIndicatorDemoScreen.this.mymodel.setValue(i);

try

{

// Dumb thread

// Work should be here

sleep(1000);

}

catch(InterruptedException ie)

{

}

}

}

}

To sum up, I recommend you test with all the style options we talked about to select the most appropriate for each task. Sometimes you don’t need to display the percentage because the task is not long enough, and sometimes it is. It’s up to you to make your application transitions and operations friendlier for the user.

This post is part of the series: BlackBerry UI Development

Working with the user interface of BlackBerry 6 OS. Learn about different UI components and how to use them with some easy to follow code samples and snippets.

  1. BlackBerry 6.0 OS UI components - RichList
  2. BlackBerry 6.0 OS UI components - ToolBar
  3. BlackBerry 6.0 OS UI Components - Activity Indicator
  4. BlackBerry 6.0 OS UI Components - Progress Indicator
  5. BlackBerry 6.0 OS UI Components - Table