<UserControl x:Class="AIRS.CircleProgress"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:AIRS"
             mc:Ignorable="d" 
             d:DesignHeight="120" d:DesignWidth="120">
    <Grid>
        <Grid x:Name="LayoutRoot" Background="Transparent" 
              HorizontalAlignment="Center" VerticalAlignment="Center">

            <Grid.RenderTransform>

                <ScaleTransform x:Name="SpinnerScale" 
                                ScaleX="1.0" ScaleY="1.0" />

            </Grid.RenderTransform>

            <Canvas RenderTransformOrigin="0.5,0.5" 
                    HorizontalAlignment="Center" 
                    VerticalAlignment="Center" 
                    Width="120" Height="120" >

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="20.1696" 
                         Canvas.Top="9.76358" 
                         Stretch="Fill" Fill="Cyan" 
                         Opacity="1.0"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="2.86816" 
                         Canvas.Top="29.9581" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.9"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="5.03758e-006" 
                         Canvas.Top="57.9341" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.8"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="12.1203" 
                         Canvas.Top="83.3163" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.7"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="36.5459" 
                         Canvas.Top="98.138" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.6"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="64.6723" 
                         Canvas.Top="96.8411" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.5"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="87.6176" 
                         Canvas.Top="81.2783" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.4"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="98.165" 
                         Canvas.Top="54.414" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.3"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="92.9838" 
                         Canvas.Top="26.9938" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.2"/>

                <Ellipse Width="21.835" Height="21.862" 
                         Canvas.Left="47.2783" 
                         Canvas.Top="0.5" Stretch="Fill" 
                         Fill="Cyan" Opacity="0.1"/>

                <Canvas.RenderTransform>

                    <RotateTransform x:Name="SpinnerRotate" 
                                     Angle="0" />

                </Canvas.RenderTransform>

                <Canvas.Triggers>

                    <EventTrigger RoutedEvent="ContentControl.Loaded">

                        <BeginStoryboard>

                            <Storyboard>

                                <DoubleAnimation 
                                    Storyboard.TargetName="SpinnerRotate" 
                                     Storyboard.TargetProperty="(RotateTransform.Angle)" 
                                     From="0" To="360" 
                                     Duration="0:0:01" 
                                     RepeatBehavior="Forever" />

                            </Storyboard>

                        </BeginStoryboard>

                    </EventTrigger>

                </Canvas.Triggers>

            </Canvas>

            <Label Content="loading......" Width="70" Margin="25,45,25,45" Foreground="White" VerticalContentAlignment="Center"></Label>
        </Grid>
    </Grid>
</UserControl>
