【WPF动画】

动画类	描述	使用示例	适用场景
DoubleAnimation	用于为 double 类型的属性（如 Width, Height 等）创建动画。	xml	控件大小的变化、透明度的渐变等。
ColorAnimation	用于为 Color 类型的属性（如 Background, Foreground 等）创建动画。	xml	背景色、前景色的渐变效果。
PointAnimation	用于为 Point 类型的属性（如 Center, Position 等）创建动画。	xml	控件位置的变化、路径动画。
ThicknessAnimation	用于为 Thickness 类型的属性（如 Margin, Padding 等）创建动画。	xml	控件的内外边距动画效果。
VectorAnimation	用于为 Vector 类型的属性（如 GradientStop.Offset 等）创建动画。	xml	渐变偏移动画。
ObjectAnimationUsingKeyFrames	用于为非数值类型的属性（如 Visibility 等）创建动画。	xml	控件显示状态的渐变（Visible, Hidden, Collapsed）。
Storyboard	控制一组动画的时序和执行。	xml	将多种动画组合成复杂动画效果。
BooleanAnimationUsingKeyFrames	为 bool 类型的属性创建动画。	xml	控件的启用状态等布尔属性的变化。
RectAnimation	为 Rect 类型的属性（如 Clip, Viewbox 等）创建动画。	xml	剪裁区域、视图框的动画。
Int32Animation	用于为 int 类型的属性（如 Count, Index 等）创建动画。	xml	列表项的计数变化等。

使用场景解释：

• DoubleAnimation: 当你需要平滑地改变控件的大小、位置、透明度等属性时，使用 DoubleAnimation 是最常见的选择。
• ColorAnimation: 适用于颜色过渡效果，比如当按钮被点击时改变背景色。
• PointAnimation: 可以用来控制图形对象的移动，尤其是在 Path 动画中。
• ThicknessAnimation: 用于边距或填充的动画，例如在控件被悬停时动态改变其边距。
• VectorAnimation: 适用于渐变背景的动画效果，特别是在复杂的渐变操作中。
• ObjectAnimationUsingKeyFrames: 适用于非数值属性的离散变化，比如在特定时间点改变控件的 Visibility。
• Storyboard: 适合在复杂动画场景中同时控制多种动画的执行顺序和同步。
• BooleanAnimationUsingKeyFrames: 适用于布尔值的动画，比如启用/禁用控件。
• RectAnimation: 适用于剪裁和视图框动画，尤其是在处理图像或视频剪裁时。
• Int32Animation: 适用于整数属性的变化，比如动画化索引或计数。

示例代码1

要使用这些动画类，可以在 XAML 中直接定义，也可以在 C# 代码中以编程方式创建和启动。例如，Storyboard 可以包含多种动画，并通过 Begin 方法启动：

<Button Content="Animate" Name="button">
    <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="button" Storyboard.TargetProperty="Width" From="100" To="300" Duration="0:0:2" />
                Storyboard>
            BeginStoryboard>
        EventTrigger>
    Button.Triggers>
Button>

示例代码2：使用 Storyboard 组合多个动画

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="300" Width="400">
    <Grid>
        <Button x:Name="MyButton" Content="Click Me" Width="100" Height="50" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Button.Triggers>
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard>
                        <Storyboard>
                            
                            <DoubleAnimation 
                                Storyboard.TargetName="MyButton" 
                                Storyboard.TargetProperty="Width" 
                                From="100" To="200" 
                                Duration="0:0:2" />

                            
                            <DoubleAnimation 
                                Storyboard.TargetName="MyButton" 
                                Storyboard.TargetProperty="Height" 
                                From="50" To="100" 
                                Duration="0:0:2" />

                            
                            <ColorAnimation 
                                Storyboard.TargetName="MyButtonBackground" 
                                Storyboard.TargetProperty="Color" 
                                From="LightBlue" To="LightCoral" 
                                Duration="0:0:2" />

                            
                            <DoubleAnimation 
                                Storyboard.TargetName="MyButton" 
                                Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" 
                                From="0" To="360" 
                                Duration="0:0:2" />

                        Storyboard>
                    BeginStoryboard>
                EventTrigger>
            Button.Triggers>
            
            <Button.Background>
                <SolidColorBrush x:Name="MyButtonBackground" Color="LightBlue"/>
            Button.Background>
            
            <Button.RenderTransform>
                <RotateTransform Angle="0" />
            Button.RenderTransform>
            <Button.RenderTransformOrigin>0.5,0.5Button.RenderTransformOrigin>
        Button>
    Grid>
Window>

代码解释

1. 宽度动画 (DoubleAnimation):

   • 目标是按钮的 Width 属性。
   • 动画将按钮的宽度从 100 增加到 200，持续时间为 2 秒。

2. 高度动画 (DoubleAnimation):

   • 目标是按钮的 Height 属性。
   • 动画将按钮的高度从 50 增加到 100，持续时间为 2 秒。

3. 颜色动画 (ColorAnimation):

   • 目标是按钮的背景颜色。
   • 动画将按钮的背景色从 LightBlue 渐变到 LightCoral，持续时间为 2 秒。

4. 旋转动画 (DoubleAnimation):

   • 目标是按钮的旋转角度。
   • 动画将按钮顺时针旋转 360 度，持续时间为 2 秒。

5. Storyboard:

   • 将以上所有动画组合在一起，在按钮点击时同时播放这些动画，形成一个复杂的动画效果。

6. RenderTransform:

   • 为按钮添加一个旋转变换，以便旋转动画能够正常工作。

应用场景

这个 Storyboard 示例展示了如何在用户点击按钮时，创建一个包括尺寸变化、颜色渐变和旋转的复杂动画。这种技术非常适合在用户界面中创建引人注目的效果，比如点击反馈、过渡效果或者引导用户注意某个特定控件。

你可以根据需要向 Storyboard 添加更多动画，甚至可以控制它们的播放顺序（如顺序播放或延迟播放），从而实现更复杂的动画效果。