如何在 WPF 代码隐藏中沿路径移动椭圆

Question

我正在尝试在代码隐藏中沿着简单的 PathGeometry 移动椭圆。椭圆出现。路径显示出来。什么都没有动。我缺少什么？谢谢！

这就是我所拥有的。原理图是一个画布。 sData 包含一个路径。代码是VB编写的。

                    OrPath = New Path
                    OrPath.Stroke = HGLBrush
                    OrPath.StrokeThickness = 1
                    OrPath.Data = Geometry.Parse(sData)

                    'Add to PathGeometry named flowPathGeometry
                    FlowPathGeometry = New PathGeometry
                    FlowPathGeometry.AddGeometry(OrPath.Data)
                    FlowPathGeometry.Freeze()

                    SchematicDiagram.Children.Add(OrPath)

                    'Now animate ------------------------------------------------------

                    'Create the Ellipse to animate.

                    Dim shapeMatrixTransform As New MatrixTransform()

                    Dim newellipse As New Ellipse
                    newellipse.Name = "FlowPathCircle"
                    newellipse.Fill = Brushes.Blue
                    newellipse.Height = 5
                    newellipse.Width = 5
                    newellipse.RenderTransform = shapeMatrixTransform
                    SchematicDiagram.Children.Add(newellipse)

                    NameScope.SetNameScope(SchematicDiagram, New NameScope())
                    SchematicDiagram.RegisterName("shapeMatrixTransform", newellipse)

                    'Create a MatrixAnimationUsingPath to move the shape along the path by animating its MatrixTransform
                    Dim ma As New Animation.MatrixAnimationUsingPath()
                    ma.Duration = TimeSpan.FromSeconds(5)
                    ma.RepeatBehavior = Media.Animation.RepeatBehavior.Forever
                    ma.PathGeometry = FlowPathGeometry 'the path "geometry" To use

                    'Set the animation to target the Matrix property
                    'of the MatrixTransform named "shapeMatrixTransform".
                    Media.Animation.Storyboard.SetTargetName(ma, "shapeMatrixTransform")
                    Media.Animation.Storyboard.SetTargetProperty(ma, New PropertyPath(MatrixTransform.MatrixProperty))

                    'Create a Storyboard to contain and apply the animation
                    Dim pathAnimationStoryboard As New Animation.Storyboard
                    pathAnimationStoryboard.Children.Add(ma)

                    'To Start the storyboard.
                    pathAnimationStoryboard.Begin(SchematicDiagram)

'Nothing Happens in the canvas after this code executes

Answer 1

您不需要故事板。只要打电话

shapeMatrixTransform.BeginAnimation(MatrixTransform.MatrixProperty, ma)

---

这是 C# 代码的精简版本。除了它不使用 Storyboard 之外，它还使用带有 EllipseGeometry 的 Path 而不是 Ellipse，因为 Path 居中，而 Ellipse 顶部/左对齐。

var data = "M100,100 L200,100 200,200 100,200Z";

var path = new Path
{
    Data = Geometry.Parse(data),
    Stroke = Brushes.Black,
    StrokeThickness = 1
};

SchematicDiagram.Children.Add(path);

var transform = new MatrixTransform();

var ellipse = new Path
{
    Data = new EllipseGeometry(new Point(), 2.5, 2.5),
    Fill = Brushes.Blue,
    RenderTransform = transform
};

SchematicDiagram.Children.Add(ellipse);

var animation = new MatrixAnimationUsingPath
{
    Duration = TimeSpan.FromSeconds(5),
    RepeatBehavior = RepeatBehavior.Forever,
    PathGeometry = path.Data.GetFlattenedPathGeometry()
};

transform.BeginAnimation(MatrixTransform.MatrixProperty, animation);