Skip to content

ProgressBar

ProgressBar() renders indeterminate progress. Pass a normalized value for determinate progress.

Choose determinate or indeterminate progress

Section titled “Choose determinate or indeterminate progress”
Column {
ProgressBar(),
ProgressBar(download_progress),
Text::Format("Downloaded {}%", static_cast<int>(download_progress * 100.0F)),
}.With(Spacing(8.0F))

The caller owns the progress value. The component does not start work, poll a task, or mutate a supplied State<float>.

Progress-indicator semantics distinguish determinate range values from indeterminate busy state. Add a semantic label when surrounding text does not name the operation.

ProgressBarStyle controls width, height, track and indicator colors, corner radius, gaps, stop indicator, indeterminate motion, segment fraction, and duration. Material and Flat themes can choose different sweep or segmented motion.

  • Constructors: ProgressBar(), ProgressBar(float), ProgressBar(State<float>).
  • Common modifiers: Frame, Grow, Opacity, Semantics.
  • Theme style: ProgressBarStyle and ProgressBarIndeterminateMotion.

Use ProgressCircle when a compact circular indicator fits the surrounding layout better.