Linear Progress Bar

The LinearProgressBar widget is used to represent the progress of any task linearly. The Linear Progress Bar is displayed in a rectangular shape and laid out horizontally on the screen.

You can use the LinearProgressBar widget to build a UI that shows downloading/uploading of files, sales this week, hours spent, overall score, etc.

Adding Linear Progress Bar

Here's how you can add the ProgressBar widget to your project:

  1. Select the Linear Progress Bar widget from the Add Widget Button or add it directly from the widget tree.

  2. Move to the Property Editor (on the right side of your screen) and scroll down to the Widget Properties section to customize it.

Customizing Linear Progress Bar

The Widget Properties Panel can be used to customize the appearance and behavior of the Linear Progress Bar.

Changing size

You can change the default size using the Width property.

To change the size of the Linear Progress Bar:

  1. Select Linear Progress Bar from the widget tree.

  2. Move to the Property Editor (on the right side of your screen).

  3. Find the Width property and enter the desired values.

Changing thickness

Changing the thickness property allows you to change the size of the progress bar belt.

  1. Select Linear Progress Bar from the widget tree.

  2. Move to the Property Editor (on the right side of your screen).

  3. Find the Thickness property and enter the value.

Common customization

There are some common customizations that you can make on both Circular and Linear ProgressBar, such as Background Color, Indicator Color, Animation Duration, Animation End Length, Border Radius and Curve (Animation). You can find the details here.

Last updated