XAML - Animation编写

 1 <Grid>
 2
 3     <Grid.Resources>
 4
 5         <Storyboard x:Name="buttonAnimation">
 6
 7             <!--简单数值类变换动画-->
 8             <DoubleAnimation
 9             Storyboard.TargetName="button"
10             Storyboard.TargetProperty="Width"
11             By="200"
12             Duration="0:0:1"
13             EnableDependentAnimation="True"/>
14
15             <ColorAnimation
16             Storyboard.TargetName="bg_color"
17             Storyboard.TargetProperty="Color"
18             From="Red" To="Blue"
19             Duration="0:0:1"
20             EnableDependentAnimation="True"/>
21
22             <PointAnimation
23             Storyboard.TargetName="ellipseGeometry"
24             Storyboard.TargetProperty="Center"
25             From="0,0" To="100,100"
26             Duration="0:0:1"
27             EnableDependentAnimation="True"/>
28
29             <ObjectAnimationUsingKeyFrames
30             Storyboard.TargetName="button"
31             Storyboard.TargetProperty="Foreground"
32             Duration="0:0:1">
33                 <!--第一个关键帧-->
34                 <DiscreteObjectKeyFrame KeyTime="0:0:0.3">
35                     <DiscreteObjectKeyFrame.Value>
36                         <SolidColorBrush Color="Red"/>
37                     </DiscreteObjectKeyFrame.Value>
38                 </DiscreteObjectKeyFrame>
39                 <!--第二个关键帧-->
40                 <DiscreteObjectKeyFrame KeyTime="0:0:0.6">
41                     <DiscreteObjectKeyFrame.Value>
42                         <SolidColorBrush Color="AliceBlue"/>
43                     </DiscreteObjectKeyFrame.Value>
44                 </DiscreteObjectKeyFrame>
45             </ObjectAnimationUsingKeyFrames>
46
47         </Storyboard>
48
49         <SolidColorBrush x:Name="bg_color" Color="Black"/>
50
51     </Grid.Resources>
52
53     <Button x:Name="button" Content="变换的按钮" Width="100" HorizontalAlignment="Center" Foreground="White" Background="{StaticResource bg_color}" Click="button_Click"/>
54     <Path Fill="Blue">
55         <Path.Data>
56             <GeometryGroup>
57                 <EllipseGeometry x:Name="ellipseGeometry"
58             Center="200,100" RadiusX="15" RadiusY="15" />
59                 <RectangleGeometry Rect="10,10,50,50"/>
60             </GeometryGroup>
61         </Path.Data>
62     </Path>
63 </Grid>
64
65
66 <Grid>
67     <Grid.Resources>
68         <Storyboard x:Name="buttonAnimation">
69             <PopInThemeAnimation
70                 Storyboard.TargetName="rectangle"/>
71         </Storyboard>
72     </Grid.Resources>
73     <Button x:Name="rectangle" Content="Button" HorizontalAlignment="Center" Click="Button_Click" Opacity="1"/>
74 </Grid>