Question

我有一个WPF应用程序，窗口中有一个图像。当某个事件被触发时，我想通过动画一个在感兴趣点缩小到空的圆圈来吸引用户注意图像上的一个点。实际上，我希望这个动画重复三次以确保用户看到缩小的圆圈并且他的眼睛被吸引到感兴趣的点。

您如何建议我在WPF中执行此操作？

Answer 1

以下代码将使您的动画正常工作。您需要做一些工作才能找到要放置圆圈的位置（点）。

  <Canvas Height="40" Width="40" >

                <Path Fill="Red" Stroke="Black" StrokeThickness="1">
                    <Path.Data>
                        <EllipseGeometry x:Name="circleGeometry" Center="100,100" RadiusX="40" RadiusY="40" />
                    </Path.Data>
                    <Path.Triggers>
                        <EventTrigger RoutedEvent="Path.Loaded">
                            <BeginStoryboard>
                                <Storyboard>                                   
                                    <DoubleAnimation 
                                            Storyboard.TargetName="circleGeometry" 
                                            Storyboard.TargetProperty="RadiusX" AutoReverse="True"
                                            Duration="0:0:3" To="5" RepeatBehavior="0:0:18"/>
                                    <DoubleAnimation 
                                            Storyboard.TargetName="circleGeometry" 
                                            Storyboard.TargetProperty="RadiusY" AutoReverse="True" 
                                            Duration="0:0:3" To="5" RepeatBehavior="0:0:18"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </Path.Triggers>
                </Path>
            </Canvas>

Answer 2

要设置中心属性的动画，请使用PointAnimation而不是DoubleAnimation。 DoubleAnimation和RadiusX仍应使用RadiusY。

为图像上的缩小圆圈设置动画

2 个答案: