WPF 各种基础动画实现

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace AnimationTest
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
DoubleAnimation a = new DoubleAnimation();//定义
a.RepeatBehavior = new RepeatBehavior(2);//重复次数，延迟不重复
//a.RepeatBehavior = new RepeatBehavior(TimeSpan.Parse("0:0:15"));//整个动画持续时间，中途停止动画
//a.RepeatBehavior = RepeatBehavior.Forever;//无限重复
a.BeginTime=TimeSpan.Parse("0:0:1");//延迟开始时间
//a.SpeedRatio = 2;//动画速度快2倍，影响TimeSpan.Parse
//a.AccelerationRatio = 0.33;//加速阶段从时间百分比0%到33%
//a.DecelerationRatio = 0.33;//减速阶段从时间百分比100%-33%到100%；
//a.IsCumulative = true;//仅与RepeatBehavior一起使用在a.By下50-150-50跳150-200-150
//a.IsAdditive = true;//获取属性默认值，从默认值开始动画
//a.FillBehavior = FillBehavior.Stop;//动画完之后恢复原始值
//a.From = 50;//起始，若默认值不是50则跳到50在进行动画
a.AutoReverse = true;//往返
//a.To = 100;
a.By = 100;//等于a.To = 100 + a.Form;
a.Duration = new Duration(TimeSpan.Parse("0:0:5"));//花费时间
b.BeginAnimation(Button.WidthProperty,a);//调用开始
}
}
}

<Window x:Class="AnimationTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Style x:Key="bt1" TargetType="{x:Type Button}">
<Setter Property="Background" Value="Yellow"/>
<Style.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard TargetProperty="Width">
<DoubleAnimation To="100" Duration="0:0:5" AutoReverse="True" IsAdditive="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<Canvas Margin="12,12,359,187">
<Button x:Name="b" Width="25">
CS
</Button>
<Button Canvas.Top="28" Width="50" Style="{StaticResource ResourceKey=bt1}">
XAML
</Button>
<Button Canvas.Top="55">
Color
<Button.Background>
<LinearGradientBrush>
<GradientStop Color="Blue" Offset="0"/>
<GradientStop Color="Black" Offset="0.5"/>
<GradientStop Color="Blue" Offset="1"/>
</LinearGradientBrush>
</Button.Background>
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard >
<ColorAnimation From="Black" To="White" Duration="0:0:2" AutoReverse="True"
Storyboard.TargetProperty="Background.GradientStops[1].Color"
RepeatBehavior="Forever"/>
<DoubleAnimation From="0" To="1" Duration="0:0:2" AutoReverse="True"
Storyboard.TargetProperty="Background.GradientStops[1].Offset"
RepeatBehavior="Forever"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
<Button Canvas.Top="84" Canvas.Left="0">
Color
<Button.Background>
<LinearGradientBrush>
<GradientStop Color="Blue" Offset="0"/>
<GradientStop Color="White" Offset="0.5"/>
<GradientStop Color="Blue" Offset="1"/>
</LinearGradientBrush>
</Button.Background>
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation From="0" To="1" Duration="0:0:2" AutoReverse="True"
Storyboard.TargetProperty="Background.GradientStops[1].Offset"
RepeatBehavior="Forever"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
</Canvas>
<Canvas Margin="161,12,114,174">
<Canvas.Triggers>
<EventTrigger RoutedEvent="Canvas.Loaded">
<BeginStoryboard>
<Storyboard TargetName="p2" TargetProperty="Opacity">
<DoubleAnimation From="1" To="0" AutoReverse="True" RepeatBehavior="Forever" Duration="0:0:5"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Canvas.Triggers>
<Image Name="p1" Source="/AnimationTest;component/Images/p1.bmp" />
<Image Name="p2" Source="/AnimationTest;component/Images/p2.bmp" />
</Canvas>
<Canvas Margin="400,12,12,264" Background="Black" TextBlock.Foreground="White" TextBlock.FontSize="30">
<Canvas.Triggers>
<EventTrigger RoutedEvent="Canvas.Loaded">
<BeginStoryboard>
<Storyboard TargetProperty="Opacity" RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetName="title1" BeginTime="0:0:2"
From="0" To="1" Duration="0:0:2" AutoReverse="True"/>
<DoubleAnimation Storyboard.TargetName="title2" BeginTime="0:0:6"
From="0" To="1" Duration="0:0:2" AutoReverse="True"/>
<DoubleAnimation Storyboard.TargetName="title3" BeginTime="0:0:10"
From="0" To="1" Duration="0:0:2" AutoReverse="True"/>
<DoubleAnimation Storyboard.TargetName="title4" BeginTime="0:0:14"
From="0" To="1" Duration="0:0:2" AutoReverse="True"/>
<DoubleAnimation Storyboard.TargetName="title5" BeginTime="0:0:18"
From="0" To="1" Duration="0:0:2" AutoReverse="True"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Canvas.Triggers>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0" Name="title1">title1</TextBlock>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0" Name="title2">title2</TextBlock>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0" Name="title3">title3</TextBlock>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0" Name="title4">title4</TextBlock>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Opacity="0" Name="title5">title5</TextBlock>
</Canvas>
<Canvas Margin="0,144,12,89" Background="Black">
<Image Source="/AnimationTest;component/Images/1.bmp" Height="25" Width="25">
<Image.Triggers>
<EventTrigger RoutedEvent="Image.Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Left)"
From="0" To="400" Duration="0:0:9" RepeatBehavior="Forever" AutoReverse="True"/>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.Top)"
Duration="0:0:9" RepeatBehavior="Forever" AutoReverse="True">
<LinearDoubleKeyFrame Value="0" KeyTime="0:0:0"/>
<LinearDoubleKeyFrame Value="30" KeyTime="0:0:1"/>
<LinearDoubleKeyFrame Value="20" KeyTime="0:0:2"/>
<LinearDoubleKeyFrame Value="50" KeyTime="0:0:3"/>
<SplineDoubleKeyFrame Value="0" KeySpline="0,1 1,0" KeyTime="0:0:4"/>
<SplineDoubleKeyFrame Value="50" KeySpline="0,1 1,0" KeyTime="0:0:5"/>
<SplineDoubleKeyFrame Value="0" KeySpline="0,1 1,0" KeyTime="0:0:6"/>
<DiscreteDoubleKeyFrame Value="50" KeyTime="0:0:7"/>
<DiscreteDoubleKeyFrame Value="0" KeyTime="0:0:8"/>
<DiscreteDoubleKeyFrame Value="50" KeyTime="0:0:9"/>
<!--KeyTime省略则匀速动画，也可以用百分比设值、Paced速率-->
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Image.Triggers>
</Image>
</Canvas>
<Canvas Margin="400,67,66,223" Background="Black" TextBlock.Foreground="White">
<TextBlock Width="37" Height="21" Text="play">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<StringAnimationUsingKeyFrames Storyboard.TargetProperty="Text" Duration="0:0:5" RepeatBehavior="Forever" AutoReverse="True">
<DiscreteStringKeyFrame Value="play"/>
<DiscreteStringKeyFrame Value="Play"/>
<DiscreteStringKeyFrame Value="PLay"/>
<DiscreteStringKeyFrame Value="PLAy"/>
<DiscreteStringKeyFrame Value="PLAY"/>
<DiscreteStringKeyFrame Value="PLAY"/>
</StringAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
</Canvas>
</Grid>
</Window>