Question

我想要一个适应窗口大小的动画。

我从pointanimationusingpath example复制了代码并稍微改了一下。我添加了一条新路径，因此我可以看到圆圈所遵循的路径。我也为循环做了一个更简单的路径。

我可以将Stretch="Fill"添加到显示圆圈路径的路径中。现在，路径的大小随窗口大小而变化。如何使用动画的路径执行此操作并使其遵循与显示的路径相同的路径？

<Window x:Class="TestPointAlongPath.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
        mc:Ignorable="PresentationOptions"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Path Data="M1,200 L275,1 L345,200" Margin="15,15,15,15" 
                        Stroke="#BF708090" StrokeThickness="3" />

        <Path Fill="Blue" Margin="15,15,15,15" >
            <Path.Data>

                <!-- The EllipseGemetry specifies the shape and position of the Ellipse. The
            Center property is animated, causing the Ellipse to animate across the screen-->
                <EllipseGeometry x:Name="MyAnimatedEllipseGeometry"
                Center="10,100" RadiusX="15" RadiusY="15"/>
            </Path.Data>
            <Path.Triggers>
                <EventTrigger RoutedEvent="Path.Loaded">
                    <BeginStoryboard Name="MyBeginStoryboard">
                        <Storyboard>

                            <!-- Animates the ellipse along the path. -->
                            <PointAnimationUsingPath
                    Storyboard.TargetName="MyAnimatedEllipseGeometry"
                    Storyboard.TargetProperty="Center"
                    Duration="0:0:7.5" 
                    RepeatBehavior="Forever" >
                                <PointAnimationUsingPath.PathGeometry>
                                    <PathGeometry 
                        Figures="M1,200 L275,1 L345,200"
                        PresentationOptions:Freeze="True">
                                        <PathGeometry.Transform>
                                            <ScaleTransform ScaleX="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=Grid}}"
                                                            ScaleY="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=Grid}}"/>
                                        </PathGeometry.Transform>
                                    </PathGeometry>
                                </PointAnimationUsingPath.PathGeometry>
                            </PointAnimationUsingPath>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Path.Triggers>
        </Path>
    </Grid>
</Window>

Answer 1

您在“画布”下托管了“路径”。画布要求确切的位置。而是使用Grid。所有路径将一个位于另一个之上。然后，您可以使用它们的Stretch属性来计算它们的拉伸。此外，你不需要Page元素..

如何将wpf中的动画缩放到窗口大小

1 个答案: