2011-06-21 17 views
1

しばらくの間、この問題を回避し、解決策をオンラインで探していない。継続時間に基づいてオブジェクトをあるポイントから別のポイントに移動

たとえば、スプライトが(10,10)にある場合は、(50,100)と言うように移動し、2秒かそれ以外の時間を指定して処理します。これの背後にある正確な数学は何ですか?私は速度を決定するために距離ベースのソリューションを使用していましたが、プロセスを制御するためにランダム修飾子を使用していました。私は設定された期間にわたって正確に実行するために、より正確なものが必要です。

この問題に関するお手伝いをさせていただきます。

答えて

3

すなわち(線形補間を仮定すると、一定の位置を終了するには、開始位置から直線的に移動します率):

開始から終了までのベクトルは、destination-startです(例:40,90)。

2秒以上かかるようにするには、1秒間に移動する距離を2で割る必要があります(例:20,45)。

任意の時刻に位置を取得するには、最初に開始時刻を記録し、現在の時刻から開始時刻を差し引いた秒数を計算します。したがって、アニメーションが12:01:30.000で開始し、12:01:31.500になった場合、アニメーションの開始から1.5秒が経過しています。

(10,10)+(20,45)* 1.5 =(10:

あなたは私の例ではので、時間が経過*第二のベクターあたりの移動に開始位置を追加し、現在位置を取得するには、10)+(30、67.5)=(40、77.5)

0

これは補間と時間の単なるものです。 、...リニア、洞、次があります。ここ

であるActionScriptで、いくつかのより多くの情報と例: link

0

jQueryのアニメーションアルゴリズムを詳しく見てみましょう。おそらくコードのいくつかを使うことができます。

http://code.jquery.com/jquery-1.6.1.js(「カスタム:」を検索)。

0

これを行うには、開始位置、終了位置、継続時間、および経過時間の情報が必要です。

ここでは、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; 
     } 
    } 
} 

あなたはどのよう内のすべてのその興味がないと結果だけが欲しい、私は心をこめて​​や他の無数のいずれかのようなトゥイーンエンジンをお勧めしている場合そのうちの。ちょうどフラッシュで来るものからはっきりとしておいてください、それはちょっとしたことです。

関連する問題