ProgressBar

To use any of below styles, just insert the following setting to your progress bars tag:

Classes="STYLE_NAME"

Where STYLE_NAME is the name of the style you want to add.

Regular progress bar style (Additional classes not required)

Uses the Primary Dark color scheme, background using primary light color scheme, and horizontal progress indicator by default. (Default style)

Tips: Vertical variation of ProgressBar is available for use. Just change property Orientation to Vertical.

Regular progress bar style, vertical variation (Orientation="Vertical")

Circular progress bar style

Circle

Uses the Primary Dark color scheme.

Tips: To change color scheme of ProgressBar, add tag Foreground="{DynamicResource BRUSH_NAME}" to your ProgressBar. You can look this page (Brush names) to know which brush name could be used.