MSDN 教学短片 WPF 14(2D动画之—Trigger)

2D动画之—Trigger

我们知道Trigger是一个触发器，它按条件应用属性值或执行操作。

要注意的是：若要使触发器有意义，必须在 Trigger 上同时指定 Property 和 Value 属性。如果这两个属性或其中一个未设置，则会引发异常。

此外，还有其他类型的触发器。MultiTrigger 用于根据多个属性的状态应用更改。EventTrigger 用于指定在发生事件时应用更改。DataTrigger 和 MultiTrigger 用于数据绑定属性。

下面通过实例来了解强大的Trigger

首先我们画个矩形在面板上,并对它设置一个RotateTransform，我们后面要对这个RotateTransform，实现动画。

<Rectangle Width="60" Height="60" Fill="BlueViolet">
            <Rectangle.RenderTransform>
                <RotateTransform x:Name="rotate1" Angle="0" CenterX="30" CenterY="30" />
            </Rectangle.RenderTransform>
        </Rectangle>

再放四个按钮，实现开始旋转矩形，暂停，继续，停止。

<Button Content="Start" Margin="88,234,365,51" Name="btnStart" />
    <Button Content="Pause" Margin="162,234,291,51" Name="tnPause" />
    <Button Content="Resume" Margin="233,234,220,51" Name="btnResume"/>
    <Button Content="Stop" Margin="320,234,133,51" Name="btnStop" />

下面来设置这四个按钮的Trigger，分别实现相应的功能。

<Grid.Triggers>
            <EventTrigger SourceName="btnStart" RoutedEvent="Button.Click">
                <EventTrigger.Actions>
                <BeginStoryboard x:Name="bs">
                    <Storyboard RepeatBehavior="Forever">
                        <DoubleAnimation Storyboard.TargetName="rotate1" 
                                         Storyboard.TargetProperty="Angle"
                                         From="0" To="360" Duration="0:0:5"/>
                    </Storyboard>
                </BeginStoryboard>
                </EventTrigger.Actions>
            </EventTrigger>
            <EventTrigger SourceName="btnPause" RoutedEvent="Button.Click">
                <EventTrigger.Actions>
                    <PauseStoryboard  BeginStoryboardName="bs"/>
                </EventTrigger.Actions>
            </EventTrigger>
            <EventTrigger SourceName="btnResume" RoutedEvent="Button.Click">
                <EventTrigger.Actions>
                    <ResumeStoryboard BeginStoryboardName="bs"/>
                </EventTrigger.Actions>
            </EventTrigger>
            <EventTrigger SourceName="btnStop" RoutedEvent="Button.Click">
                <EventTrigger.Actions>
                    <StopStoryboard BeginStoryboardName="bs"/>
                </EventTrigger.Actions>
            </EventTrigger>
        </Grid.Triggers>

这里用到了BeginStoryboard 它的含义是：

一个触发器操作，该操作可启动 Storyboard 并将其动画分发给动画的目标对象和属性。

这里的DoubleAnimation 是:

在指定的 Duration 内使用线性内插对两个目标值之间的 Double 属性值进行动画处理。

PauseStoryboard ,ResumeStoryboard ,StopStoryboard 分别表示暂停，继续，停止操作。

运行效果：