progressBar

LIVE DEMO

progressBar is an indicator that shows the progress of the task or process. The progress can be determinate or indeterminate. Use progressBar to indicate an ongoing process that takes a noticeable time to finish.

  • XML-element: progressBar

  • Java class: ProgressBar

Determinate Progress

By default, progressBar shows progress in the determinate mode. This mode can give users an idea of how long the process will take — the progress indicator will increase in size based on the value obtained from the process.

The example below displays progress for a simple background task:

<progressBar id="progressBar"/>
@ViewComponent
protected ProgressBar progressBar;
@Autowired
protected BackgroundWorker backgroundWorker;

private static final int ITERATIONS = 6;

@Subscribe
protected void onInit(InitEvent event) {
    BackgroundTask<Integer, Void> task = new BackgroundTask<Integer, Void>(100) {
        @Override
        public Void run(TaskLifeCycle<Integer> taskLifeCycle) throws Exception {
            for (int i = 1; i <= ITERATIONS; i++) {
                TimeUnit.SECONDS.sleep(1); (1)
                taskLifeCycle.publish(i);
            }
            return null;
        }
        @Override
        public void progress(List<Integer> changes) {
            double lastValue = changes.get(changes.size() - 1);
            progressBar.setValue(lastValue / ITERATIONS); (2)
        }
    };
    BackgroundTaskHandler taskHandler = backgroundWorker.handle(task);
    taskHandler.execute();
}
1 Some task that takes time to complete
2 Set the current progress value which must be within the 0.0 and 1.0 range
progress bar determinate

Indeterminate Progress

In the indeterminate mode progressBar cycles repeatedly along the length of the bar without showing a specific progress value. This mode can be used for a process which doesn’t share its progress value.

To use this mode, set the indeterminate attribute to true:

<progressBar id="indeterminateProgressBar" indeterminate="true"/>
progress bar indeterminate

Attributes

id - alignSelf - classNames - colspan - height - indeterminate - max - maxHeight - maxWidth - min - minHeight - minWidth - themeNames - value - visible - width

indeterminate

Vaadin

Enables or disables the indeterminate progress mode.

max

Vaadin

Sets the maximum progress value. Reaching this value indicates completion of the process. Default is 1.0.

min

Vaadin

Sets the minimum progress value. Indicates that the process is not started. Default is 0.0.

themeNames

Vaadin

Sets a different theme to change component’s colors and draw user attention.

progress bar themenames

  • contrast - applies more contrasting color scheme.

  • error - signals of an error state.

  • success - indicates success.

value

Vaadin

Defines a value of progressBar. The value must be within the default 0.0 and 1.0 range or custom min and max range, if specified.

If the value cannot be parsed to double the error message appears.

Handlers

AttachEvent - DetachEvent

To generate a handler stub in Jmix Studio, use the Handlers tab of the Jmix UI inspector panel or the Generate Handler action available in the top panel of the view class and through the Code → Generate menu (Alt+Insert / Cmd+N).

See Also

See Vaadin Docs for more information.