Skip to content
FEEDBACK · FREE

ProgressCircular

A ring that shows progress at a glance.

A ring that shows progress at a glance, in very little space.

Why it helps

  • Compact
  • Value in the ring
  • Accessible

Where it fits

  • Cards
  • Buttons
  • Dashboards
ProgressCircular control in a RayCraft page

Example

<Stack Align="center" Spacing="6">
    <ProgressCircular Value="@_value" Label="Upload progress" Size="Size.Small" />
    <ProgressCircular Value="@_value" Label="Upload progress" />
    <ProgressCircular Value="@_value" Label="Upload progress" Size="Size.Large" />
    <Slider @bind-Value="_value" Min="0" Max="100" Label="Value" />
</Stack>

@code {
    private double _value = 64;
}

A short fragment. Add @using RayCraft.Blazor.Components to your page and use an interactive render mode.

Included in RayCraft Free. Working examples are in the GitHub repository (MIT); it holds example and demo code, not the library code.

All controls ยท Documentation