我创建了一个循环处理动画,类似于Chrome浏览器选项卡上看到的…我想在整个应用程序中使用它,因此决定将其作为资源..但是..我想知道什么是在我的应用程序中轻松使用此动画资源的最佳方式/练习…下面是我处理动画的xaml代码.
它应该用作DataTemplate还是ControlTemplate?
它应该用作DataTemplate还是ControlTemplate?
<Grid> <Grid.Resources> <Storyboard x:Key="LoadingAnimation" RepeatBehavior="Forever"> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(c:Arc.EndAngle)" Storyboard.TargetName="arc"> <EasingDoubleKeyFrame KeyTime="0" Value="90"/> <EasingDoubleKeyFrame KeyTime="0:0:0.6" Value="-90"/> <EasingDoubleKeyFrame KeyTime="0:0:1.2" Value="-270"/> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(c:Arc.StartAngle)" Storyboard.TargetName="arc"> <EasingDoubleKeyFrame KeyTime="0" Value="-90"/> <EasingDoubleKeyFrame KeyTime="0:0:0.6" Value="-270"/> <EasingDoubleKeyFrame KeyTime="0:0:1.2" Value="-450"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </Grid.Resources> <Grid.Triggers> <EventTrigger RoutedEvent="FrameworkElement.Loaded"> <BeginStoryboard Storyboard="{StaticResource LoadingAnimation}"/> </EventTrigger> </Grid.Triggers> <c:Arc x:Name="arcbackground" StartAngle="0" EndAngle="359.9" stroke="#FFE0E0E0" strokeThickness="8"/> <c:Arc x:Name="arc" stroke="{StaticResource BlueGradientBrush}" strokeThickness="8"/>
解决方法
几天前我需要类似的东西.我将故事板和元素放在用户控件中进行动画处理.我添加了一个依赖属性,可以通过biding来启动/停止动画.剩下的就是在应用程序中的任何地方使用用户控件.
我的XAML看起来像这样:
<UserControl x:Class="MyAssembly.SpinningWait" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:core="clr-namespace:MyAssembly"> <UserControl.Resources> <Storyboard x:Key="canvasAnimation"> <DoubleAnimationUsingKeyFrames RepeatBehavior="Forever" Speedratio="24" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="canvas"> <discreteDoubleKeyFrame KeyTime="0:0:2" Value="45"/> <discreteDoubleKeyFrame KeyTime="0:0:4" Value="90"/> <discreteDoubleKeyFrame KeyTime="0:0:6" Value="135"/> <discreteDoubleKeyFrame KeyTime="0:0:8" Value="180"/> <discreteDoubleKeyFrame KeyTime="0:0:10" Value="225"/> <discreteDoubleKeyFrame KeyTime="0:0:12" Value="270"/> <discreteDoubleKeyFrame KeyTime="0:0:14" Value="315"/> <discreteDoubleKeyFrame KeyTime="0:0:16" Value="360"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </UserControl.Resources> <core:RadialPanel x:Name="canvas" RenderTransformOrigin="0.5,0.5"> <core:RadialPanel.Resources> <Style targettype="Ellipse"> <Setter Property="Height" Value="6" /> <Setter Property="Width" Value="6" /> <Setter Property="Fill" Value="White" /> </Style> </core:RadialPanel.Resources> <core:RadialPanel.RenderTransform> <TransformGroup> <RotateTransform/> </TransformGroup> </core:RadialPanel.RenderTransform> <Ellipse /> <Ellipse Opacity="0.1" /> <Ellipse Opacity="0.2" /> <Ellipse Opacity="0.3" /> <Ellipse Opacity="0.4" /> <Ellipse Opacity="0.5" /> <Ellipse Opacity="0.6" /> <Ellipse Opacity="0.7" /> </core:RadialPanel> </UserControl>
它的代码隐藏:
public partial class SpinningWait : UserControl { private Storyboard _storyboard; public SpinningWait() { InitializeComponent(); } public bool IsWaiting { get { return (bool)GetValue(IsWaitingProperty); } set { SetValue(IsWaitingProperty,value); } } public static readonly DependencyProperty IsWaitingProperty = DependencyProperty.Register("IsWaiting",typeof(bool),typeof(SpinningWait),new UIPropertyMetadata(false,new PropertyChangedCallback(OnIsWaitingChanged))); private static void OnIsWaitingChanged(DependencyObject d,DependencyPropertyChangedEventArgs e) { ((SpinningWait)d).OnIsWaitingChanged((object)d,e); } private void OnIsWaitingChanged(object sender,DependencyPropertyChangedEventArgs e) { if (IsWaiting) { this.Visibility = Visibility.Visible; this.StartAnimation(); } else { this.Visibility = Visibility.Collapsed; this.StopAnimation(); } } private void StartAnimation() { this._storyboard = (Storyboard)FindResource("canvasAnimation"); this._storyboard.Begin(canvas,true); } private void StopAnimation() { this._storyboard.Remove(canvas); } }