根据持续时间将对象从一个点移动到另一个点

本文关键字：一个 移动 另一个 持续时间 对象 | 更新日期: 2023-09-27 18:00:00

我一直在思考这个问题，并在网上寻找解决方案，但没有效果。

基本上，如果我有一个精灵，例如位于（10，10），我想把它移动到（50100），整个过程需要2秒或我指定的任何持续时间。这背后的确切数学是什么？我使用基于距离的解决方案来确定速度，但只是使用随机修改器来控制过程。我需要一些更精确的东西来在设定的持续时间内准确执行。

如果能在这个问题上提供任何帮助，我们将不胜感激！

根据持续时间将对象从一个点移动到另一个点

假设线性插值（即以恒定速率沿直线从起始位置移动到结束位置）：

从开始到目的地的矢量是destination-start，即对于您的示例（40,90）。

如果你想在两秒钟内发生这种情况，你需要将其除以2，得到每秒行驶的距离，例如（20,45）每秒。

要获得任何给定时间的位置，首先记录开始时间，然后计算当前时间减去以秒为单位的开始时间。因此，如果动画从12:01:30.000开始，现在是12:01:31.500，那么距离动画开始已经过去了1.5秒。

为了获得当前位置，您将开始位置添加到每秒移动矢量*经过的时间，因此在我的示例中：

（10,10）+（20,45）*1.5=（10,110）+（30.67.5）=（40.77.5）

这只是插值和时间的问题。有线性的，正弦的，二次的。。。

以下是actionscript中的一些更多信息和示例：链接

深入了解jQuery的动画算法。。。也许你可以使用一些代码。

http://code.jquery.com/jquery-1.6.1.js（搜索"custom:"作为起点）。

您需要几条信息来完成这项工作，包括开始位置、结束位置、持续时间和经过的时间。

下面是actionscript中的一个示例：

package {
    import flash.utils.getTimer;
    import flash.events.Event;
    import flash.display.Shape;
    import flash.geom.Point;
    import flash.display.Sprite;
    public class Mover extends Sprite {
        private var circle      :Shape;
        private var start       :Point;
        private var end         :Point;
        private var duration    :int;
        public function Mover() {
            // first we create something to move, like, a circle
            circle = new Shape();
            circle.graphics.beginFill(0xff00ff);
            circle.graphics.drawCircle(0, 0, 20);
            addChild(circle);
            // start and end positions
            start = new Point(0, 0);
            end = new Point(100, 100);
            // and finally, the duration, i'm using milliseconds
            duration = 2000;
            // this event handler will run each frame
            addEventListener(Event.ENTER_FRAME, handleEnterFrame);
        }
        private function handleEnterFrame(event:Event):void {
            // we figure out how much of the animation has elapsed by using getTimer
            // should you want to use a start time, add it here 
            var progress:Number = getTimer() / duration;
            // we need to clamp our progress so we don't under- or overshoot the target
            if(progress < 0) progress = 0;
            if(progress > 1) progress = 1;

            // then it's a matter of setting the position
            // we use the start position as a base and then gradually add in 
            // the difference between the start and the end
            circle.x = start.x + (end.x - start.x) * progress;
            circle.y = start.y + (end.y - start.y) * progress;  
        }
    }
}

如果你对how不太感兴趣，只想得到结果，我衷心推荐像TweenSite这样的推文引擎或其他无数的推文。只要远离闪光灯，这有点垃圾。

相关文章：