WPF Animation 动画变化值的监控

WPF 动画

XXXAnimation 即关键类继承制AnimationBase 的动画类

• 线性插值动画主要属性

  • From
  • To
  • Duration
  • Accelerator
  • Deccelerator
  • FillBehavior
    等这些常用属性里不做介绍，主要介绍一下几个故事板属性，以备忘记.

名称	说明
Completed	动画到达终点时触发，该事件中可以用于删除之前的动画，比如有些时候我们需要连续增加动画时，为了动画衔接可以在该事件中处理
CurrentGlobalSpeedInvalidated	速度发生了变化，或者动画被暂停、重新开始、停止或移到某个新的位置。当动画始终翻转时，以及当动画加速和减速时，也会引发改事件。用于监控速度变化
CurrentStateInvalidated	动画已经开始或结束
CurrentTimeInvalidate	这个属性要着重介绍一下，一看这里有个Time,那肯定是与始终有关系的，没错。该事件时动画始终已经向前移动了一个步长(By),正在更改动画。当动画开始、停止或结束时也会引发该事件。可以通过该事件监控动画变化的数值，这样我们可以通过回调向外通知变化值
RemoveRequest	动画正在被移除。使用动画的属性随后回返回位原来的值。动画移除方法是添加一个空的动画，如obj.BeginAnimation(xxxProperty,null)

说明

CurrentTimeInvealidate 事件：每次向前移动动画时钟都会引发该事件（通常美妙移动60次，但如果执行的代码需要更长时间，可能回丢失始终刻度）
当引发CurrentTimeInvalidated事件时，发送者Sender 是Clock对象（Clock类位于System.Windows.Media.Animation命名空间）。可以通过Clock对象检索当前时间，当前时间使用TimeSpan对象表示；并可医检所当前进度，当前进度使用0-1之间的数值表示（即百分比）。

下面通过一个小的示例介绍一下动画变化值的监控

• XMAL

<Window x:Class="WpfApp10.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp10"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="300">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0" Width="30">
            <Rectangle VerticalAlignment="Bottom"   x:Name="r1" Height="0" Fill="Green" />
        </Border>
        <StackPanel Orientation="Vertical" Grid.Column="1">
            <TextBlock x:Name="txtVal" Width="120" Height="30" Text="0" FontSize="22" />
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="通过回调获取的值:" VerticalAlignment="Center"/>
                <TextBlock x:Name="txtCallValue" Foreground="Red" FontSize="22" Margin="10" />
            </StackPanel>
        </StackPanel>
    </Grid>
</Window>

• CS

using System;
using System.Windows;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace WpfApp10
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainWindow : Window
    {
        private Action<string> ReportValue;
        public MainWindow()
        {
            InitializeComponent();
            Loaded += MainWindow_Loaded;
            ReportValue = (str) =>{
                this.Dispatcher.Invoke((Action)delegate{
                    txtCallValue.Text = str;
                });
            };
        }

        private void MainWindow_Loaded(object sender, RoutedEventArgs e)
        {
            DoubleAnimation da = new DoubleAnimation();
            da.From = r1.Height;
            da.To = 300;
            da.Duration = new Duration(TimeSpan.FromMilliseconds(8000));
            da.CurrentTimeInvalidated += Da_CurrentTimeInvalidated;
            r1.BeginAnimation(Rectangle.HeightProperty, da);
            

        }

        private string s;
        private void Da_CurrentTimeInvalidated(object sender, EventArgs e)
        {
            Clock clock = (Clock)sender;
            this.Dispatcher.Invoke((Action)delegate
            {
                 s= string.Format("{0:N0}",clock.CurrentProgress * 300);
                 if (ReportValue != null) {
                    ReportValue(s);
                 }
                txtVal.Text = s;

            }  
            );
        }

      
    }
}

• 效果