Progress Bar

Displays a visual progress indicator showing a value relative to a maximum. Renders as a filled bar with optional label.

Properties

Property	Type	Default	Description
value	number	50	The current progress value. Supports expressions.
max	number	100	The maximum value (100% mark).
label	text	''	Optional label displayed on or near the bar. Supports expressions.

Example

Show project completion percentage:

Value: `{ {row.completed_tasks}}`
Max: `{ {row.total_tasks}}`
Label: `{ {row.completed_tasks}}`/`{ {row.total_tasks}}` tasks

A simple percentage bar:

Value: 75
Max: 100
Label: 75%

Tips

• Use expressions for value to make the bar data-driven: { {row.progress}}.
• The bar fills proportionally: value / max * 100% of the container width.
• Style the bar color, height, and border-radius via the Design tab.
• Combine with a Text widget below it to show the exact value if the label alone is not enough.