Content Comparison

A progress bar can be used to indicate the progress of an operation

How to use a button on the layout designer page:

Steps to configure:

1. Goto component section

2. Search and select the progress bar component in the component section

3. Drag and drop the progress bar component on the layout

Configurations of a progress bar component

• Label: To display on UI

• Progress bar size: the size of the progress bar to be displayed on UI like x-small, small, medium, large

• Variant: The progress bar comes in five variants:

  • Default

  • Inverse

  • Success

  • Warning

  • Error

• Value: value to be bound to the progress bar

• Show percentage: shows the progress of operation in terms of percentage on the progress bar

• Show rounded: shows progress bar round shaped

• Show vertical: shows progress bar vertically

• Value Destination Type: The user can bind a value to the progress bar component in two ways

  • Variable: The user can create a variable of type integer from the variable tab with a default value and can use such a variable as value to the progress bar component

Image Removed

Image Added

• • Model: The user can create a model and use such model as value to the progress bar component. the model captures value from an object that we select while model creation