用WPF来做一个动画

用WPF来做一个动画

开发工具与关键技术：Visual Studio 2015、WPF
作者：郑伟基
撰写时间：2019年4月12号

下面我们使用WPF来做一个动画，在上面的动画中需要用到图形的坐标来画一个图形出来，见下面的代码：
XAML代码如下：

 <Window x:Class="动画_四角星.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">
    <Grid>
        <!--四角星-->
        <Grid >
            <Polyline Points="225,25  310,25 340,-35 375,25 460,25 400,75 440,140 255,140 255,140 285,75 225,25" Stroke="Red" StrokeThickness="5" Fill="Black"  Margin="-65,55,-210.6,-132.2" StrokeDashArray="2,2">
                <Polyline.Triggers>
                    <EventTrigger RoutedEvent="Polyline.Loaded">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation From="1" To="100" RepeatBehavior="Forever" Duration="0:0:5" Storyboard.TargetProperty="StrokeDashOffset" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Polyline.Triggers>
            </Polyline>
          </Grid>
    </Grid>
</Window>

在上面的代码看到我们先用坐标来画一个四角星，每个坐标都对应一个角，两个坐标连成一条线，我用了11个坐标来画一个四角星，最后一个坐标是用来密封整个图形的，图形画完之后在里面的代码写一个动画，让它能够动边框的线动起来，写一个Triggers来制成动画的效果。

下面是用XAML代码写的效果，见下面的效果图：

通过写动画的事件来使得边框的线能过一直的在循环动起来。