Avalonia Progress Ring

This project is a simple progress ring for Avalonia that's modeled off of ModernWpf's progress ring. Credit to ModernWpf for the initial code and design! v0.8.x works on Avalonia 0.9.x, and v0.9.x is compatible with Avalonia 0.10.x. v0.10.x is compatible with Avalonia 11 Preview 2+ (0.10.7+ builds on Avalonia 11.1+). v0.11.x and 1.0.0-rc1+ is compatible with Avalonia 12 Preview 1+.

Using in Your Project

Add Deadpikle.AvaloniaProgressRing to your NuGet references, then add the following to your App.xaml in Application.Styles:

<StyleInclude Source="avares://AvaloniaProgressRing/Styles/ProgressRing.xaml"/>

In your UserControl, add something like to the following:

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:progRing="clr-namespace:AvaloniaProgressRing;assembly=AvaloniaProgressRing">
    <progRing:ProgressRing Width="80" 
                           Height="80"
                           IsActive="True"
                           HorizontalAlignment="Left"
                           VerticalAlignment="Top"
                           Foreground="Green"
                           Margin="10,20,0,0"/>
</UserControl>

You can also manage the ellipse sizing and margins yourself. To do so, you must set ManuallyManageSizing to True. See the sample for more details. There's not a lot of fancy math done for you, so set the EllipseDiameter to your desired size and then fiddle with Width/Height/EllipseOffset until you get things looking the way you want it.

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:progRing="clr-namespace:AvaloniaProgressRing;assembly=AvaloniaProgressRing">
    <progRing:ProgressRing Width="80" 
                           Height="80"
                           IsActive="True"
                           HorizontalAlignment="Left"
                           VerticalAlignment="Top"
                           Foreground="Green"
                           ManuallyManageSizing="True"
                           EllipseDiameter="35"
                           EllipseOffset="0,200,0,0"
                           Margin="10,20,0,0"/>
</UserControl>

Make sure that you bind to IsActive to show/hide the progress ring!

Contributing

All contributions and improvements are welcome with one exception: no contributions made via AI or AI tools will be accepted at this time. Thanks for your involvement!

License

MIT. Thanks!