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 ...

随机推荐

微信小程序，请求php后台返回json数据多出隐藏字符问题
这几天在做一个微信小程序注册登录页面的时候碰到一个问题,就是使用wx.request api的时候success中返回的JSON数据前面会多出空白字符,后面网上查了一下是说php bom头问题(详细介 ...
ActiviMQ(1)
1. ActiviMQ是实现JMS接口和规范的消息中间件(Provider), 2. JMS,Java Message Service, java消息服务,是JavaEE中的一个技术 3. JMS规范 ...
apache 2 修改虚拟目录
准备好环境,就要开始进行开发了.这一篇,我们在Ubuntu Apache上配置虚拟目录. 知识准备: 区别于Windows 下apache,配置文件通常只有一个,就是httpd.conf. Linux ...
Vue.js：目标结构
ylbtech-Vue.js:目标结构 1.返回顶部 1. Vue.js 目录结构上一章节中我们使用了 npm 安装项目,我们在 IDE(Eclipse.Atom等) 中打开该目录,结构如下所示: ...
hadoop集群配置和在windows系统上运用java操作hdfs
安装配置概念 hadoop常用shell命令使用java操作hadoop 本文介绍hadoop集群配置和在windows系统上运用java操作hdfs 安装 http://mirror.bit. ...
springboot成神之——spring文件下载功能
本文介绍spring文件下载功能目录结构 DemoApplication WebConfig TestController MediaTypeUtils 前端测试本文介绍spring文件下载功能 ...
MongoDB在Java下的增删查改
我们总不能一直使用cmd对数据库操作,数据库总是要在程序中使用的.今天来说一下怎么通过Java调用MongoDB. 学习一下最基本也是最常用的增删查改语句,这是使用数据库的基础. 注意事项: 1.要打 ...
mysql 存储过程动态执行sql语句
之前经常在程序中拼接sql语句,其实我们也可以在存储过程中拼接sql 语句,动态的执行~~ 代码如下: DROP PROCEDURE IF EXISTS SearchByDoctor;CREATE P ...
（转）CSS布局-负边距-margin
css中的负边距(negative margin)是布局中的一个常用技巧,只要运用得合理常常会有意想不到的效果.很多特殊的css布局方法都依赖于负边距,所以掌握它的用法对于前端的同学来说,那是必须的. ...
wince驱动开发入门
因为课题前期调研没做好,用的CPU板卡和数据采集卡来自两个部门.加上买的是裸板,自己定制的OS,技术支持不爱搭理.所以给的AI板卡的驱动一直装不上,自己在郁闷中寻找答案,就扎进了wince驱动的知识库 ...

windows phone之山寨win8圆形进度条

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

随机推荐

热门专题