Windows Phone開發（38）：動畫之PointAnimation 轉：http://blog.csdn.net/tcjiaan/article/details/7536229

PointAnimation也是很簡單的，與前面說到的兩個Animation是差不多的，屬性也是一樣的，如By、From、To，不同的是，PointAnimation是目標值從一點到另一個點。

 

我有理由相信，大家一定懂的，所以，我不多介紹了，給兩個例了熱一下身就行了。

 

例一，讓直線動起來。

 

這個例子，以LineGeometry作為動畫的目標對象，通過對StartPoint屬性和EndPoint屬性進行動畫來讓直線（其實是線段）動起來。

 

[html] view plaincopyprint?

1. <Grid>  
2.     <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch"  
3.           Stroke="Orange" StrokeThickness="6">  
4.         <Path.Data>  
5.             <LineGeometry x:Name="lg" StartPoint="25,32" EndPoint="185,97"/>  
6.         </Path.Data>  
7.     </Path>  
8.     <Grid.Resources>  
9.         <Storyboard x:Name="std" RepeatBehavior="Forever" AutoReverse="True">  
10.             <PointAnimation Duration="0:0:5"  
11.                             Storyboard.TargetName="lg"  
12.                             Storyboard.TargetProperty="StartPoint"  
13.                             To="20,375"/>  
14.             <PointAnimation Duration="0:0:5"  
15.                             Storyboard.TargetName="lg"  
16.                             Storyboard.TargetProperty="EndPoint"  
17.                             To="407,490"/>  
18.         </Storyboard>  
19.     </Grid.Resources>  
20. </Grid>  

記得了，在頁面的Loaded事件中啟用動畫。

[csharp] view plaincopyprint?

1. // 建構函式  
2. public MainPage()  
3. {  
4.     InitializeComponent();  
5.   
6.     this.Loaded += (sender, e) =>  
7.         {  
8.             this.std.Begin();  
9.         };  
10. }  

 

 

 

 

例二，對曲線進行動畫。

 

本例對BezierSegment的三個點進行動畫，即使貝茲路徑“遊動”起來。

[html] view plaincopyprint?

1. <Grid>  
2.     <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch"  
3.           Stroke="LightGreen" StrokeThickness="12">  
4.         <Path.Data>  
5.             <PathGeometry>  
6.                 <PathFigure StartPoint="180,35">  
7.                     <BezierSegment x:Name="pbm"   
8.                                    Point1="28,180"  
9.                                    Point2="200,270"  
10.                                    Point3="412,700"/>  
11.                 </PathFigure>  
12.             </PathGeometry>  
13.         </Path.Data>  
14.     </Path>  
15.     <Grid.Resources>  
16.         <Storyboard x:Name="std" RepeatBehavior="Forever" AutoReverse="True">  
17.             <PointAnimation Duration="0:0:3"  
18.                             Storyboard.TargetName="pbm"  
19.                             Storyboard.TargetProperty="Point1"  
20.                             From="27,162" To="415,145"/>  
21.             <PointAnimation Duration="0:0:3"  
22.                             Storyboard.TargetName="pbm"  
23.                             Storyboard.TargetProperty="Point2"  
24.                             To="600,400"/>  
25.             <PointAnimation Duration="0:0:3"  
26.                             Storyboard.TargetName="pbm"  
27.                             Storyboard.TargetProperty="Point3"  
28.                             To="10,700"/>  
29.         </Storyboard>  
30.     </Grid.Resources>  
31. </Grid>  

 

後台代碼就是在Loaded事件中啟用動畫，這個大家應該會了。

 

 

好了，這節課就這樣很輕鬆地過了。