Windows Phone開發（38）：動畫之PointAnimation

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

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

例一，讓直線動起來。

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

    <Grid>        <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch"              Stroke="Orange" StrokeThickness="6">            <Path.Data>                <LineGeometry x:Name="lg" StartPoint="25,32" EndPoint="185,97"/>            </Path.Data>        </Path>        <Grid.Resources>            <Storyboard x:Name="std" RepeatBehavior="Forever" AutoReverse="True">                <PointAnimation Duration="0:0:5"                                Storyboard.TargetName="lg"                                Storyboard.TargetProperty="StartPoint"                                To="20,375"/>                <PointAnimation Duration="0:0:5"                                Storyboard.TargetName="lg"                                Storyboard.TargetProperty="EndPoint"                                To="407,490"/>            </Storyboard>        </Grid.Resources>    </Grid>

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

        // 建構函式        public MainPage()        {            InitializeComponent();            this.Loaded += (sender, e) =>                {                    this.std.Begin();                };        }

例二，對曲線進行動畫。

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

    <Grid>        <Path HorizontalAlignment="Stretch" VerticalAlignment="Stretch"              Stroke="LightGreen" StrokeThickness="12">            <Path.Data>                <PathGeometry>                    <PathFigure StartPoint="180,35">                        <BezierSegment x:Name="pbm"                                        Point1="28,180"                                       Point2="200,270"                                       Point3="412,700"/>                    </PathFigure>                </PathGeometry>            </Path.Data>        </Path>        <Grid.Resources>            <Storyboard x:Name="std" RepeatBehavior="Forever" AutoReverse="True">                <PointAnimation Duration="0:0:3"                                Storyboard.TargetName="pbm"                                Storyboard.TargetProperty="Point1"                                From="27,162" To="415,145"/>                <PointAnimation Duration="0:0:3"                                Storyboard.TargetName="pbm"                                Storyboard.TargetProperty="Point2"                                To="600,400"/>                <PointAnimation Duration="0:0:3"                                Storyboard.TargetName="pbm"                                Storyboard.TargetProperty="Point3"                                To="10,700"/>            </Storyboard>        </Grid.Resources>    </Grid>

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

 

 

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