windows phone之山寨win8圆形进度条

<ResourceDictionary

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:controls="clr-namespace:Monsters.WindowsPhone.Controls;assembly=PhoneClassLibrary1"

>

<Style TargetType="controls:ProgressRing">

<Setter Property="Foreground" Value="#ffffff" />

<Setter Property="IsHitTestVisible" Value="False" />

<Setter Property="HorizontalAlignment" Value="Center" />

<Setter Property="VerticalAlignment" Value="Center" />

<Setter Property="MinHeight" Value="" />

<Setter Property="MinWidth" Value="" />

<Setter Property="IsTabStop" Value="False" />

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="controls:ProgressRing">

<Border x:Name="ProgressRingRoot" Background="{TemplateBinding Background}"

BorderThickness="{TemplateBinding BorderThickness}"

BorderBrush="{TemplateBinding BorderBrush}">

<Border.Resources>

<Style x:Key="ProgressRingEllipseStyle" TargetType="Ellipse">

<Setter Property="Opacity" Value="" />

<Setter Property="HorizontalAlignment" Value="Left" />

<Setter Property="VerticalAlignment" Value="Top" />

</Style>

</Border.Resources>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="SizeStates">

<VisualState x:Name="Large">

<Storyboard>

<ObjectAnimationUsingKeyFrames Duration=""

Storyboard.TargetName="SixthCircle"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Small" />

</VisualStateGroup>

<VisualStateGroup x:Name="ActiveStates">

<VisualState x:Name="Inactive" />

<VisualState x:Name="Active">

<Storyboard RepeatBehavior="Forever">

<ObjectAnimationUsingKeyFrames Duration=""

Storyboard.TargetName="Ring"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E1"

Storyboard.TargetProperty="Opacity"

BeginTime="">

<DiscreteDoubleKeyFrame KeyTime="" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E2"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.167">

<DiscreteDoubleKeyFrame KeyTime="" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E3"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.334">

<DiscreteDoubleKeyFrame KeyTime="" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E4"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.501">

<DiscreteDoubleKeyFrame KeyTime="" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E5"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.668">

<DiscreteDoubleKeyFrame KeyTime="" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E6"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.835">

<DiscreteDoubleKeyFrame KeyTime="" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E1R"

BeginTime=""

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="" Value="-110" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E2R"

BeginTime="00:00:00.167"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="" Value="-116" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E3R"

BeginTime="00:00:00.334"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="" Value="-122" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-2" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E4R"

BeginTime="00:00:00.501"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="" Value="-128" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-8" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E5R"

BeginTime="00:00:00.668"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="" Value="-134" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-14" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E6R"

BeginTime="00:00:00.835"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="" Value="-140" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-20" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value=""/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Grid x:Name="Ring"

Margin="{TemplateBinding Padding}"

MaxWidth="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.MaxSideLength}"

MaxHeight="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.MaxSideLength}"

Visibility="Collapsed"

RenderTransformOrigin=".5,.5"

FlowDirection="LeftToRight">

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E1R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E1"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E2R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E2"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E3R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E3"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E4R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E4"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E5R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E5"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5"

Visibility="Collapsed"

x:Name="SixthCircle">

<Canvas.RenderTransform>

<RotateTransform x:Name="E6R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E6"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

</Grid>

</Border>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ResourceDictionary>

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Windows;

using System.Windows.Controls;

namespace Monsters.WindowsPhone.Controls

{

    public class ProgressRing : Control

    {

        bool hasAppliedTemplate = false;

        public ProgressRing()

        {

            this.DefaultStyleKey = typeof(ProgressRing);

            TemplateSettings = new TemplateSettingValues();

        }

        public override void OnApplyTemplate()

        {

            base.OnApplyTemplate();

            hasAppliedTemplate = true;

            UpdateState(this.IsActive);

        }

        void UpdateState(bool isActive)

        {

            if (hasAppliedTemplate)

            {

                string state = isActive ? "Active" : "Inactive";

                System.Windows.VisualStateManager.GoToState(this, state, true);

            }

        }

        protected override System.Windows.Size MeasureOverride(System.Windows.Size availableSize)

        {

            var width = 100D;

            if (!System.ComponentModel.DesignerProperties.IsInDesignTool)

                width = this.Width != double.NaN ? this.Width : availableSize.Width;

            TemplateSettings = new TemplateSettingValues(width);

            return base.MeasureOverride(availableSize);

        }

        public bool IsActive

        {

            get { return (bool)GetValue(IsActiveProperty); }

            set { SetValue(IsActiveProperty, value); }

        }

        // Using a DependencyProperty as the backing store for IsActive.  This enables animation, styling, binding, etc...

        public static readonly DependencyProperty IsActiveProperty =

            DependencyProperty.Register("IsActive", typeof(bool), typeof(ProgressRing), new PropertyMetadata(false, new PropertyChangedCallback(IsActiveChanged)));

        private static void IsActiveChanged(DependencyObject d, DependencyPropertyChangedEventArgs args)

        {

            var pr = (ProgressRing)d;

            var isActive = (bool)args.NewValue;

            pr.UpdateState(isActive);

        }

        public TemplateSettingValues TemplateSettings

        {

            get { return (TemplateSettingValues)GetValue(TemplateSettingsProperty); }

            set { SetValue(TemplateSettingsProperty, value); }

        }

        // Using a DependencyProperty as the backing store for TemplateSettings.  This enables animation, styling, binding, etc...

        public static readonly DependencyProperty TemplateSettingsProperty =

            DependencyProperty.Register("TemplateSettings", typeof(TemplateSettingValues), typeof(ProgressRing), new PropertyMetadata(new TemplateSettingValues()));

        public class TemplateSettingValues : System.Windows.DependencyObject

        {

            public TemplateSettingValues(double width)

            {

                MaxSideLength = ;

                EllipseDiameter = width / ;

                EllipseOffset = new System.Windows.Thickness(EllipseDiameter);

            }

            public double MaxSideLength

            {

                get { return (double)GetValue(MaxSideLengthProperty); }

                set { SetValue(MaxSideLengthProperty, value); }

            }

            // Using a DependencyProperty as the backing store for MaxSideLength.  This enables animation, styling, binding, etc...

            public static readonly DependencyProperty MaxSideLengthProperty =

                DependencyProperty.Register("MaxSideLength", typeof(double), typeof(TemplateSettingValues), new PropertyMetadata(0D));

            public double EllipseDiameter

            {

                get { return (double)GetValue(EllipseDiameterProperty); }

                set { SetValue(EllipseDiameterProperty, value); }

            }

            // Using a DependencyProperty as the backing store for EllipseDiameter.  This enables animation, styling, binding, etc...

            public static readonly DependencyProperty EllipseDiameterProperty =

                DependencyProperty.Register("EllipseDiameter", typeof(double), typeof(TemplateSettingValues), new PropertyMetadata(0D));

            public Thickness EllipseOffset

            {

                get { return (Thickness)GetValue(EllipseOffsetProperty); }

                set { SetValue(EllipseOffsetProperty, value); }

            }

            // Using a DependencyProperty as the backing store for EllipseOffset.  This enables animation, styling, binding, etc...

            public static readonly DependencyProperty EllipseOffsetProperty =

                DependencyProperty.Register("EllipseOffset", typeof(Thickness), typeof(TemplateSettingValues), new PropertyMetadata(new Thickness()));

        }

    }

}

样式：

<ResourceDictionary

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:controls="clr-namespace:Monsters.WindowsPhone.Controls;assembly=PhoneClassLibrary1"

>

<Style TargetType="controls:ProgressRing">

<Setter Property="Foreground" Value="#ffffff" />

<Setter Property="IsHitTestVisible" Value="False" />

<Setter Property="HorizontalAlignment" Value="Center" />

<Setter Property="VerticalAlignment" Value="Center" />

<Setter Property="MinHeight" Value="20" />

<Setter Property="MinWidth" Value="20" />

<Setter Property="IsTabStop" Value="False" />

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="controls:ProgressRing">

<Border x:Name="ProgressRingRoot" Background="{TemplateBinding Background}"

BorderThickness="{TemplateBinding BorderThickness}"

BorderBrush="{TemplateBinding BorderBrush}">

<Border.Resources>

<Style x:Key="ProgressRingEllipseStyle" TargetType="Ellipse">

<Setter Property="Opacity" Value="0" />

<Setter Property="HorizontalAlignment" Value="Left" />

<Setter Property="VerticalAlignment" Value="Top" />

</Style>

</Border.Resources>

<VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="SizeStates">

<VisualState x:Name="Large">

<Storyboard>

<ObjectAnimationUsingKeyFrames Duration="0"

Storyboard.TargetName="SixthCircle"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Small" />

</VisualStateGroup>

<VisualStateGroup x:Name="ActiveStates">

<VisualState x:Name="Inactive" />

<VisualState x:Name="Active">

<Storyboard RepeatBehavior="Forever">

<ObjectAnimationUsingKeyFrames Duration="0"

Storyboard.TargetName="Ring"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E1"

Storyboard.TargetProperty="Opacity"

BeginTime="0">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="0" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="0" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E2"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.167">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="0" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="0" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E3"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.334">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="0" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="0" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E4"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.501">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="0" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="0" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E5"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.668">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="0" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="0" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E6"

Storyboard.TargetProperty="Opacity"

BeginTime="00:00:00.835">

<DiscreteDoubleKeyFrame KeyTime="0" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.21" Value="1" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.22" Value="0" />

<DiscreteDoubleKeyFrame KeyTime="0:0:3.47" Value="0" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E1R"

BeginTime="0"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="0" Value="-110" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="10" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="93"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="205" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="357" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value="439"/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="585" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E2R"

BeginTime="00:00:00.167"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="0" Value="-116" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="4" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="87"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="199" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="351" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value="433"/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="579" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E3R"

BeginTime="00:00:00.334"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="0" Value="-122" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-2" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="81"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="193" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="345" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value="427"/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="573" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E4R"

BeginTime="00:00:00.501"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="0" Value="-128" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-8" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="75"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="187" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="339" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value="421"/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="567" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E5R"

BeginTime="00:00:00.668"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="0" Value="-134" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-14" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="69"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="181" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="331" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value="415"/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="561" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames

Storyboard.TargetName="E6R"

BeginTime="00:00:00.835"

Storyboard.TargetProperty="Angle">

<SplineDoubleKeyFrame KeyTime="0" Value="-140" KeySpline="0.13,0.21,0.1,0.7"/>

<SplineDoubleKeyFrame KeyTime="0:0:0.433" Value="-20" KeySpline="0.02,0.33,0.38,0.77"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.2" Value="63"/>

<SplineDoubleKeyFrame KeyTime="0:0:1.617" Value="175" KeySpline="0.57,0.17,0.95,0.75"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.017" Value="325" KeySpline="0,0.19,0.07,0.72"/>

<SplineDoubleKeyFrame KeyTime="0:0:2.783" Value="409"/>

<SplineDoubleKeyFrame KeyTime="0:0:3.217" Value="555" KeySpline="0,0,0.95,0.37"/>

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

</VisualStateManager.VisualStateGroups>

<Grid x:Name="Ring"

Margin="{TemplateBinding Padding}"

MaxWidth="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.MaxSideLength}"

MaxHeight="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.MaxSideLength}"

Visibility="Collapsed"

RenderTransformOrigin=".5,.5"

FlowDirection="LeftToRight">

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E1R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E1"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E2R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E2"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E3R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E3"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E4R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E4"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5">

<Canvas.RenderTransform>

<RotateTransform x:Name="E5R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E5"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

<Canvas RenderTransformOrigin=".5,.5"

Visibility="Collapsed"

x:Name="SixthCircle">

<Canvas.RenderTransform>

<RotateTransform x:Name="E6R" />

</Canvas.RenderTransform>

<Ellipse

x:Name="E6"

Style="{StaticResource ProgressRingEllipseStyle}"

Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseDiameter}"

Margin="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.EllipseOffset}"

Fill="{TemplateBinding Foreground}"/>

</Canvas>

</Grid>

</Border>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

</ResourceDictionary>

支持wp7、wp8.。当然wp8.1 自带这个控件

windows phone之山寨win8圆形进度条的更多相关文章

原生javascript模仿win8等待进度条。
一.序言一直很中意win8等待提示圆圈进度条.win8刚出来那会,感觉好神奇!苦于当时没思路,没去研究.通过最近网上找找资料,终于给搞出来了!先上Demo,献丑了!预览请看:win8进度条. 二.简 ...
WPF利用动画实现圆形进度条
原文:WPF利用动画实现圆形进度条这是我的第一篇随笔,最近因为工作需要,开始学习WPF相关技术,自己想实现以下圆形进度条的效果,逛了园子发现基本都是很久以前的文章,实现方式一般都是GDI实现的,想到 ...
Google Chrome 圆形进度条
Conmajia © 2012 Updated on Feb. 21, 2018 Google Chrome 的圆形进度条. Demo 功能显示百分比(0-100).如果进度值达到 100%,则将闪 ...
android 自定义控件——（四）圆形进度条
----------------------------------↓↓圆形进度条(源代码下有属性解释)↓↓---------------------------------------------- ...
WPF 实现圆形进度条
项目中用到圆形进度条,首先就想到使用 ProgressBar 扩展一个,在园子里找到迷途的小榔头给出的思路和部分代码,自己加以实现. 进度小于60显示红色,大于60则显示绿色.效果如下: 基本思路: ...
html5 svg 圆形进度条
html5 svg 圆形进度条 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
canvas圆形进度条
通过定义一个canvas标签, new方法传进ID值,和旋转角度值,即可生成圆形进度条 <!DOCTYPE html> <html lang="en"> & ...
iOS之UI--Quartz2D的入门应用--重绘下载圆形进度条
*:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...
Android 高手进阶之自定义View，自定义属性（带进度的圆形进度条）
Android 高手进阶(21) 版权声明:本文为博主原创文章,未经博主允许不得转载. 转载请注明地址:http://blog.csdn.net/xiaanming/article/detail ...

随机推荐

linux(centos7) 安装nginx
linux(centos7) 安装nginx 1.14(stable) 版本 Nginx配置文件常见结构的从外到内依次是「http」「server」「location」等等,缺省的继承关系是从外到内, ...
Dell PowerEdge R720内存安装原则
Dell PowerEdge R720内存安装原则摘要:系统包含 24 个内存插槽,分为两组(每组 12 个),每个处理器一组.每组的 12 个插槽分入四个通道.在每个通道中,第一个插槽的释放 ...
在ERP软件行业项目应该怎么做？
本人进入软件行业已经有5个年头了,主导实施和参与过的大大小小的项目有20余个.其中有些项目做的非常好,提升了客户企业的管理水平,也规范了企业的业务操作水平,优化了企业的流程,客户非常认同我们实施的价值 ...
从零开始搭建包含多个子系统的Vue工程项目
本文以windows为例,介绍支持多个子系统的Vue工程项目的搭建过程,相对于单一系统的工程,多个子系统引入了如下一些问题: 项目目录结构设计打包结果设计:每个子系统可以独立发布上线多布局实现:多 ...
CDM中，创建一个或多个组合属性的唯一约束
除主键外,有时还需要创建一个或多个组合字段的唯一约束,方法如下: 双击打开实体,在idntifier标签页中可看到默认主键的唯一约束,在其下方添加一条记录,然后双击该记录,打开约束设置窗口在该窗口的 ...
cin cout getline string
1.C++ code, When we want to read a number whatever the type is int or double , just use cin >> ...
coprime Sequence
Do you know what is called ``Coprime Sequence''? That is a sequence consists of nn positive integers ...
使用axis2进行WebService的开发
使用axis2进行WebService的开发 Apache Axis2 是 Apache Axis SOAP 项目的后继项目.此项目是 Web 服务核心引擎的重要改进,目标是成为 Web 服务和面向服 ...
SonarQube在CentOS上的安装
1 简介 SonarQube 是一个用于代码质量管理的开放平台.通过插件机制,Sonar 可以集成不同的测试工具,代码分析工具,以及持续集成工具.与持续集成工具(例如 Hudson/Jenkins 等 ...
DAY.15_Python
昨天完成了三级菜单和购物车程序的作业: """ .__author__.=,"JerseyHg" 作业要求:1. 可依次选择进入到下一级菜单:2. 可 ...

windows phone之山寨win8圆形进度条

windows phone之山寨win8圆形进度条的更多相关文章

随机推荐

热门专题