The ProgressBar component is designed to display the progress of a long process.

gui progressBar

XML name of the component: progressBar

gui progressBar dia

The component is implemented for Web Client and Desktop Client.

Below is an example of the component usage together with the background tasks mechanism:

<progressBar id="progressBar" width="100%"/>
protected ProgressBar progressBar;

protected BackgroundWorker backgroundWorker;

private static final int ITERATIONS = 5;

public void init(Map<String, Object> params) {
    BackgroundTask<Integer, Void> task = new BackgroundTask<Integer, Void>(300, this) {
        public Void run(TaskLifeCycle<Integer> taskLifeCycle) throws Exception {
            for (int i = 1; i <= ITERATIONS; i++) {
                TimeUnit.SECONDS.sleep(2); // time consuming task
            return null;

        public void progress(List<Integer> changes) {
            float lastValue = changes.get(changes.size() - 1);
            progressBar.setValue(lastValue / ITERATIONS);

    BackgroundTaskHandler taskHandler = backgroundWorker.handle(task);

Here in the BackgroundTask.progress() method, which is executed in UI thread, the ProgressBar component is set to the current value. The component value should be a float number from 0.0 to 1.0.

If a running process is unable to send information about the progress, an indeterminate state of the indicator can be displayed. Set the indeterminate to true to show an indeterminate state. Default is false. For example:

<progressBar id="progressBar" width="100%" indeterminate="true"/>

By default indeterminate progress bar is displayed as horizontal bar. To make it a spinning wheel instead, set the attribute stylename="indeterminate-circle".

Attributes of progressBar

align - enable - height - id - indeterminate - stylename - visible - width