如何使用 WPF canvas 以编程方式将图像从一点动画化到另一点?

How can I animate an image from one point to another programmatically using a WPF canvas?

我正在开发 WPF 应用程序。在这个应用程序中,我需要在铁路上移动我的火车。我在 canvas 上画了所有的铁路线。所以我只需要移动火车。

我也在网上搜了一下,我找到了that!例如。

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Shapes;
using System.Windows.Media.Animation;
using System.Windows.Media;

namespace SDKSamples
{
// This example shows how to use PointAnimation to animate the
// position of an ellipse by animating the Center property of an 
// EllipseGeometry. PointAnimation is used because the Center property
// takes a Point value.
public class PointAnimationExample : Page
{
    public PointAnimationExample()
    {

        // Create a NameScope for this page so that
        // Storyboards can be used.
        NameScope.SetNameScope(this, new NameScope());

        EllipseGeometry myEllipseGeometry = new EllipseGeometry();
        myEllipseGeometry.Center = new Point(200, 100);
        myEllipseGeometry.RadiusX = 15;
        myEllipseGeometry.RadiusY = 15;

        // Assign the EllipseGeometry a name so that
        // it can be targeted by a Storyboard.
        this.RegisterName(
            "MyAnimatedEllipseGeometry", myEllipseGeometry);

        Path myPath = new Path();
        myPath.Fill = Brushes.Blue;
        myPath.Margin = new Thickness(15);
        myPath.Data = myEllipseGeometry;

        PointAnimation myPointAnimation = new PointAnimation();
        myPointAnimation.Duration = TimeSpan.FromSeconds(2);

        // Set the animation to repeat forever. 
        myPointAnimation.RepeatBehavior = RepeatBehavior.Forever;

        // Set the From and To properties of the animation.
        myPointAnimation.From = new Point(200, 100);
        myPointAnimation.To = new Point(450, 250);

        // Set the animation to target the Center property
        // of the object named "MyAnimatedEllipseGeometry."
        Storyboard.SetTargetName(myPointAnimation, "MyAnimatedEllipseGeometry");
        Storyboard.SetTargetProperty(
            myPointAnimation, new PropertyPath(EllipseGeometry.CenterProperty));

        // Create a storyboard to apply the animation.
        Storyboard ellipseStoryboard = new Storyboard();
        ellipseStoryboard.Children.Add(myPointAnimation);

        // Start the storyboard when the Path loads.
        myPath.Loaded += delegate(object sender, RoutedEventArgs e)
        {
            ellipseStoryboard.Begin(this);
        };

        Canvas containerCanvas = new Canvas();
        containerCanvas.Children.Add(myPath);

        Content = containerCanvas;
    }

}

}

我试过这段代码及其工作原理。但是当我运行应用的时候,我之前画的路就不再出现了。那么我怎样才能在我的铁路上移动我的火车呢?

我继续搜索并找到了解决方案。 我曾经使用 DoubleAnimation 实例。 工作代码如下。

        public void move( Image target, double oldX, double oldY, double newX, 
        double newY,int time)
        {
        TranslateTransform trans = new TranslateTransform();
        target.RenderTransform = trans;

        DoubleAnimation anim1 = new DoubleAnimation(oldY, newY, 
TimeSpan.FromSeconds(time));
        anim1.RepeatBehavior = RepeatBehavior.Forever;
        trans.BeginAnimation(TranslateTransform.YProperty, anim1);

        DoubleAnimation anim2 = new DoubleAnimation(oldX, newX, 
TimeSpan.FromSeconds(time));
        anim2.RepeatBehavior = RepeatBehavior.Forever;
        trans.BeginAnimation(TranslateTransform.XProperty, anim2);
    }