PahtAnimation路径动画:
PointAnimationUsingPath使用路径坐标动画效果
关注点:
1 PointAnimationUsingPath 类:对两个或更多个目标值之间的 Point 属性值进行动画处理,通过使用 PathGeometry 指定这些目标值。 此动画可用于沿着路径移动可视对象。
- 设置一个线性形状Path及一个几何圆的形状Path
<Canvas HorizontalAlignment="Left" Width="340" Height="240" >
<!-- This Path is only to show the path that the animated object will follow. -->
<Path VerticalAlignment="Top" Margin="15,15,15,15"
Data="M 10,100 C 35,0 135,0 160,100 180,190 285,200 310,100"
Stroke="Black" StrokeThickness="2"
Stretch="None" />
<Path Fill="Blue" Margin="15,15,15,15">
<Path.Data>
<!-- Describes an ellipse. -->
<EllipseGeometry x:Name="MyAnimatedEllipseGeometry"
Center="10,100" RadiusX="15" RadiusY="15" />
</Path.Data>
</Path>
</Canvas>
- 针对几何圆使用路径坐标动画PointAnimationUsingPath,此处需PointAnimationUsingPath.PathGeometry确定路径路线
<!-- Create a button to restart the animation. -->
<Button Width="80" HorizontalAlignment="Left" >Start Animation
<!-- Trigger and StoryBoard to initiate the animation when the button is clicked. -->
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard Name="MyBeginStoryboard">
<Storyboard>
<!-- Animates the ellipse along the path. -->
<PointAnimationUsingPath
Storyboard.TargetName="MyAni