WPF使用Xaml代码制作心跳动画

效果展示：

 

1.准备一张爱心的Png图片

 2.将PNG文件其拷贝到项目中，在窗体里新建Image控件，代码如下：

        <Image
            x:Name="image"
            Height="50"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            Source="/心.png">
            <Image.Triggers>
                <EventTrigger RoutedEvent="Loaded">
                    <BeginStoryboard>
                        <Storyboard
                            RepeatBehavior="Forever"
                            Storyboard.TargetName="image"
                            Storyboard.TargetProperty="Height">
                            <DoubleAnimation
                                BeginTime="0:0:0.0"
                                EasingFunction="{StaticResource powerEaseOut}"
                                To="50"
                                Duration="0:0:0.6" />
                            <DoubleAnimation
                                BeginTime="0:0:0.6"
                                EasingFunction="{StaticResource powerEaseOut}"
                                To="30"
                                Duration="0:0:0.4" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Image.Triggers>
        </Image>

其中用到了动画的缓动，需要在Window的标签下面添加资源

    <Window.Resources>
        <PowerEase
            x:Key="powerEaseOut"
            EasingMode="EaseOut"
            Power="2" />
    </Window.Resources>

由于心脏在收缩时更有力，所以图片缩小动画的时间设置的要比放大的时间短，这样才会更模拟心跳的感觉