<Page
    x:Class="GaugeSamples.Speedometer"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:GaugeSamples"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:c1="using:C1.Xaml.Gauge"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">
    <Page.Resources>
        <Storyboard x:Name="AnimateGauge">
            <DoubleAnimationUsingKeyFrames EnableDependentAnimation="True" RepeatBehavior="Forever" BeginTime="00:00:00" Duration="00:00:05" AutoReverse="True" Storyboard.TargetName="gauge" Storyboard.TargetProperty="(c1Gauge.Value)">
                <SplineDoubleKeyFrame KeyTime="00:00:05.00" Value="150" KeySpline="0,0,1,0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </Page.Resources>

    <c1:C1RadialGauge x:Name="gauge"
					  PointerOrigin="0.5,0.7" StartAngle="-80" 
                      SweepAngle="160"
                      Minimum="0" Maximum="150"
                      BorderThickness="0" Background="Transparent" CoverVisibility="Collapsed" >
        <c1:C1RadialGauge.FaceTemplate>
            <DataTemplate>
                <Grid VerticalAlignment="Stretch">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="0.027*"/>
                        <RowDefinition Height="0.022*"/>
                        <RowDefinition Height="0.833*"/>
                        <RowDefinition Height="0.089*"/>
                        <RowDefinition Height="0.029*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="0.019*"/>
                        <ColumnDefinition Width="0.012*"/>
                        <ColumnDefinition Width="0.937*"/>
                        <ColumnDefinition Width="0.013*"/>
                        <ColumnDefinition Width="0.019*"/>
                    </Grid.ColumnDefinitions>
                    <Path HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" Stretch="Uniform" Stroke="#FF8D8D8D" Data="M399.5,200 C344.00015,231.99989 254.12392,241.0063 200,241.36589 C148.8284,240.81053 40.0009,231.99989 0.5,200 C2.2216523,89.832642 89.819191,0.5 200,0.5 C310.18082,0.5 397.77847,89.832642 399.5,200 z" Grid.ColumnSpan="5" Grid.RowSpan="5">
                        <Path.Fill>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFA0A0A0"/>
                                <GradientStop Color="#FFFFFFFF" Offset="0.799"/>
                                <GradientStop Color="#FFC4C4C4" Offset="1"/>
                            </LinearGradientBrush>
                        </Path.Fill>
                    </Path>
                    <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Stretch="Uniform" Stroke="#FF8D8D8D" Data="M395.50781,200.9655 C357.06546,224.21236 256.6441,242.65077 200,241.03943 C150.28514,242.65109 37.490604,229.84807 3.2331352,201.86494 C3.0179834,100.09 91.90255,1.9503412 200,1.9418252 C306.83813,1.9334084 393.983,94.080826 395.50781,200.9655 z" Grid.Column="1" Grid.Row="1" Grid.RowSpan="3" Grid.ColumnSpan="3">
                        <Path.Fill>
                            <SolidColorBrush Color="#FF2E3B51"/>
                        </Path.Fill>
                    </Path>
                    <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Fill="#19FFFFFF" Stretch="Uniform" Data="M133.57588,234.7085 C129.71172,194.63959 174.42502,62.356525 317.12341,52.342972 C464.96387,55.609425 507.78448,187.69644 506.32101,233.88622 C489.43549,241.05301 469.21542,249.04286 448.23901,252.71423 C447.81049,222.39841 423.716,73.781273 275.00308,81.737312 C160.4355,96.298767 133.1913,216.01573 132.90974,234.54318" Grid.Column="2" Grid.Row="2" />
                </Grid>
            </DataTemplate>
        </c1:C1RadialGauge.FaceTemplate>
        <c1:C1GaugeMark Interval="30" />
        <c1:C1GaugeLabel Interval="30" Location="0.85" Foreground="#FFADADAD" Format="0"  />
        <c1:C1GaugeMark Interval="10" />
    </c1:C1RadialGauge>
</Page>
