WPF动画1---基础动画

Posted 2020-10-10

基础动画

　　1.类似于DoubleAnimation等，如要想要同时改变两个，要写两次 比较麻烦 ,无法暂停或停止动画

　　任何动画必须最少三个细节，Form-初始值  To-结束值  Duration-时间长度

　　其他动画说明：SpeedRadio 提高或减慢动画速度  AutoReverse 自动返回初始值 FillBehavior

　　

1         private void button1_Click(object sender, RoutedEventArgs e)
2         {
3             DoubleAnimation widthAnimation = new DoubleAnimation();
4             widthAnimation.From = 150;
5             widthAnimation.To = 200;
6             widthAnimation.Duration = TimeSpan.FromSeconds(0.5);
7             image1.BeginAnimation(Button.WidthProperty, widthAnimation);
8         }

 

　　2.故事板

　　　　故事板是增强的时间线，可以使用它分组多个动画，并且具有控制动画播放的能力--暂停，停止，改变播放位置等。它能够使TagetProperty和TagetName属性指向一个特定的属性和特定的元素

　　　　换句话说，故事板在动画和希望应用动画属性之前架起了一个桥梁

 1         private void button2_Click(object sender, RoutedEventArgs e)
 2         {
 3             Storyboard sb = new Storyboard();
 4 
 5             DoubleAnimation da = new DoubleAnimation();
 6             da.From = 135;//设置开始值
 7             da.To = 200;//设置结束值
 8             da.Duration = TimeSpan.FromSeconds(0.5);//动画运行时间
 9             sb.Children.Add(da);//把动画对象加入到该故事板中
10 
11             //指定要执行该故事板的对象
12             Storyboard.SetTarget(da, image1);
13             //指定要进行动画处理的属性
14             Storyboard.SetTargetProperty(da, new PropertyPath(Button.WidthProperty));
15 
16 
17             //sb.Completed += new EventHandler((object sender1, EventArgs e1) => { MessageBox.Show("completed"); });
18             sb.Begin();
19         }

 

　　3.TranslateTransform

　　　　可以通过TranslateTransform的XProperty属性来更改button1的X坐标.注意到,我们并不是像以前一样直接关联到Button的某个属性(比如先前的WidthProperty),而是通过其RenderTransformProperty属性的XProperty来间接关联的,这中方式叫做"属性链"(PropertyChain)

　　　　解释propertyChain ---将RenderTransformProperty设置为TranslateTransform类型，所以第二个元素属性是TranslateTransform.XProperty)，简单地说就是(类型1.属性1,类型2.属性2,....类型n.属性n)

　　　　解释 new PropertyPath("(0).(1)", propertyChain  中的(0).(1)的意思---propertyChain 是数组，表示propertyChain数组中的TranslateTransform.XProperty属性（第二个属性）

 

 1         private void button3_Click(object sender, RoutedEventArgs e)
 2         {
 3             this.image1.RenderTransform = new TranslateTransform();
 4 
 5             Storyboard sb = new Storyboard();
 6             DoubleAnimation da = new DoubleAnimation();
 7             da.From = 12;
 8             da.To = 100;
 9             da.Duration = TimeSpan.FromSeconds(0.5);
10             sb.Children.Add(da);
11 
12             DependencyProperty[] propertyChain = new DependencyProperty[]
13             {
14                 Image.RenderTransformProperty,
15                 TranslateTransform.XProperty
16             };
17 
18             Storyboard.SetTarget(da, this.image1);
19             Storyboard.SetTargetProperty(da, new PropertyPath("(0).(1)", propertyChain));
20 
21             //sb.Completed += new EventHandler((object sender1, EventArgs e1) => { MessageBox.Show("completed"); });
22             sb.Begin();
23         }

 

 

　　4.TransformGroup

　　　　1.故事板增加TransformGroup   是把多种变化元素组合成一种变化的容器 比较好用

　　　　2.故事板Begin开始动画 只写一次就可以了 

 1         //故事板增加TransformGroup   是把多种变化元素组合成一种变化的容器 比较好用
 2         //故事板Begin开始动画 只写一次就可以了 
 3         private void button5_Click(object sender, RoutedEventArgs e)
 4         {
 5             DoubleAnimation daScX = new DoubleAnimation();
 6             DoubleAnimation daScY = new DoubleAnimation();
 7             DoubleAnimation daCor = new DoubleAnimation();
 8 
 9             //缩放、旋转、扭曲等变化效果合并起来。以下几种基本变化只是单一的变化，如果想要实现多种效果的叠加，那么就要使用到TransformGroup，否则会报错。TransformGroup的作用类似于在控件布局中的StackPanel内嵌的作用，是把多种变化元素组合成一种变化的容器。
10             TransformGroup tg = new TransformGroup(); //能够让某对象的缩放、旋转、扭曲等变化效果合并起来使用。是把多种变化元素组合成一种变化的容器
11 
12 
13             ScaleTransform sc = new ScaleTransform(); //缩放
14 
15             RotateTransform rt = new RotateTransform(); //旋转
16             TranslateTransform tt = new TranslateTransform(); //平移
17             SkewTransform st = new SkewTransform();  //扭曲
18             MatrixTransform mt = new MatrixTransform(); //能够让某对象通过矩阵算法实现更为复杂的变形。
19 
20 
21 
22             tg.Children.Add(sc);
23             image1.RenderTransform = tg; // RenderTransform类是为了达到直接去改变某个对象的形状（比如缩放、旋转一个元素）的目的而设计的，RenderTransform包含的变形属性成员就是专门用来改变对象形状的，它可以实现对元素拉伸，旋转，扭曲等效果，同时变形特效也常用于辅助产生各种动画效果。
24             image1.RenderTransformOrigin = new Point(0.5, 0.5);
25             //设置故事版
26 
27             Storyboard.SetTarget(daCor, image1);
28             Storyboard.SetTargetProperty(daCor, new PropertyPath("(UIElement.Opacity)"));
29 
30 
31             Storyboard.SetTarget(daScX, image1);
32             Storyboard.SetTargetProperty(daScX, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"));
33 
34             Storyboard.SetTarget(daScY, image1);
35             Storyboard.SetTargetProperty(daScY, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"));
36 
37 
38             Storyboard sb = new Storyboard();
39             sb.Children.Add(daScX);
40             sb.Children.Add(daScY);
41             sb.Children.Add(daCor);
42             //设置变换和时间
43             daScX.Duration = new Duration(TimeSpan.FromMilliseconds(100));
44             daScY.Duration = new Duration(TimeSpan.FromMilliseconds(100));
45             daCor.Duration = new Duration(TimeSpan.FromMilliseconds(100));
46             daCor.From = 1;
47             daCor.To = 0.7;
48 
49             daScX.From = 1;
50             daScX.To = 0.7;
51             daScY.From = 1;
52             daScY.To = 0.7;
53             sb.AutoReverse = true;
54             sb.Begin();
55         }

 

这个是我写的简单的动画demo，写了20个，简单的比较全。比较仓促，有错误的话可以跟我说下

源码下载