Question

我尝试使用路径几何体来使用WPF在曲线路径中移动图像。但是，当我点击“开始”＆＃39;按钮，画布本身在路径中移动，而不是图像。那么我将如何通过点击“开始”来移动图像。按钮？以下是已完成的代码。

这是我的xaml代码：

     <Window x:Class="WpfAppPoint4.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:local="clr-namespace:WpfAppPoint4"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
   <Storyboard x:Key="Storyboard1">
        <MatrixAnimationUsingPath 
            Storyboard.TargetProperty="RenderTransform.(MatrixTransform.Matrix)"
                Duration="0:0:5" DoesRotateWithTangent="True">
            <MatrixAnimationUsingPath.PathGeometry>
                <PathGeometry Figures="M0,0 L50,0 A100,100 0 0 1 150,100
                                           A50,50 0 1 1 100,50 L200,50"/>
            </MatrixAnimationUsingPath.PathGeometry>
        </MatrixAnimationUsingPath>
    </Storyboard>

</Window.Resources>
<Grid>
   <Canvas Name="MyCanvas" Margin="4,10,-4,-10">
   <Button x:Name="button_Start" Content="Start" HorizontalAlignment="Right" 
   VerticalAlignment="Top" Width="150" Click="Button_Start" 
   Canvas.Right="320" Canvas.Top="553" Height="45" FontFamily="Microsoft 
   Sans Serif" FontSize="20">
            <Button.Triggers>
                <EventTrigger RoutedEvent="Button.Click">
                    <BeginStoryboard Storyboard="{StaticResource 
                     Storyboard1}"/>
                </EventTrigger>
            </Button.Triggers>
        </Button>

      <Image Source="C:\Users\Merlinz\Downloads\Kid-Tap\Kid-Tap\parent.png" 
             x:Name="ParentNode" Width="40" Height="40" Canvas.Top="100" 
             Canvas.Left="5"

RenderTransformOrigin="0.5,0.5">
   <Image.RenderTransform>
        <TransformGroup>
            <MatrixTransform/>
        </TransformGroup>

    </Image.RenderTransform>

        </Image>
    </Grid>       
</Canvas>

Answer 1

为了使动画能够在Image元素上运行，您必须设置Storyboard.TargetName属性。

除此之外，当您想要在元素的RenderTransform属性中设置MatrixTransform的动画时，您不能将MatrixTransform放在TransformGroup中。

因此，请将您的图像声明更改为：

<Image x:Name="movingImage" ...>
    <Image.RenderTransform>
        <MatrixTransform/>
    </Image.RenderTransform>
</Image>

这样的动画（属性路径RenderTransform.Matrix等同于你的，但更短）：

<MatrixAnimationUsingPath 
    Storyboard.TargetProperty="RenderTransform.Matrix"
    Storyboard.TargetName="movingImage" ...>
    ...
</MatrixAnimationUsingPath>

如何通过单击按钮使用路径几何移动对象？

1 个答案: