ProgressRing Control for Windows10

ProgressRing represents a control that indicates an operation is ongoing. The typical visual appearance is a ring-shaped "spinner" that cycles an animation as progress continues.

In the following demo we are going to start and stop a ProgressRing with the help of buttons.

Step 1: Open a blank app and add a ProgressRing control and two buttons named Start and Stop either from the toolbox or by copying the following XAML code into your grid.

IsActive defines animation 

  1. <StackPanel>  
  2.     <StackPanel Orientation="Horizontal" Margin="50,80,0,0">  
  3.         <Button Name="start" Content="Start" Click="start_Click"></Button>  
  4.         <Button Name="stop" Content="Stop" Click="stop_Click" Margin="30,0,0,0"></Button>  
  5.     </StackPanel>  
  6.     <ProgressRing Name="myRing" IsActive="False" Height="50" Width="50" HorizontalAlignment="Left" Margin="80,30,0,0"></ProgressRing>  
  7. </StackPanel>   

Step 2:
Set the value of IsActive to True for start button event handler and to false for the end button event handler respectively.
  1. private void start_Click(object sender, RoutedEventArgs e)  
  2. {  
  3.     myRing.IsActive = true;  
  4. }  
  5. private void stop_Click(object sender, RoutedEventArgs e)  
  6. {  
  7.     myRing.IsActive = false;  
  8. }  
Step 3: Run the application and click on start button to start the ProgressRing.


Up Next
    Ebook Download
    View all
    View all