as3繪製拋物線

一般做頁遊的過程中,特效的釋放可能是不是固定位置的播放,是需要進行“運動的”(其實就是移動特效這個影響剪輯)。舉個例子:步兵射箭,不確定箭發射的方向,事先也不確定發射點和動畫的結束點位置,只知道攻擊方與被攻擊方的位置。一般特效是沒有方向性的,特效只是一個在特定位置播放效果的影響剪輯而已,表現上要突出的是從攻擊方到被攻擊方的一段運動軌跡,之後播放被攻擊方的受傷或是防禦動作。

從上面的描述中可以確定二點信息:

1、曲線開始的起點和結束的終點位置,可根據攻擊方、被攻擊方確定下來;

2、特效播放完畢後,需要知道它的結束時刻,以便回調函數裏響應被攻擊方的動作;

特效的播放,建議是採用監聽Event.ENTER_FRAME來進行響應,不要根據特效播放的時長來處理。

以拋物線運動爲例,根據公式 y = a * x * x + b * x + c;已知曲線公通過兩個點,起始點--攻擊方的位置,結束點--被攻擊方的位置,還要知道一箇中點,就可以確定這個公式中的參數a、b、c的值了,選取中間點爲例。它的位置(Point)爲x:(startPoint.x + (startPointx + endPoint.x) / 2),而y則等於拋物線的“幅度”。

現在就三個等式:

y1 = a * x1 * x1 + b * x1 + c;

y2 = a * x2 * x2 + b * x2 + c;

y3 = a * x3 * x3 + b * x3 + c;

解這三個方程,可得到a、b、c分別爲:

b = ((y1 - y3) * (x1 * x1 - x2 * x2) - (y1 - y2) * (x1 * x1 - x3 * x3)) / ((x1 - x3) * (x1 * x1 - x2 * x2) - (x1 - x2) * (x1 * x1 - x3 * x3)); a = ((y1 - y2) - b * (x1 - x2)) / (x1 * x1 - x2 * x2); c = y1 - a * x1 * x1 - b * x1;

其中(x1, y1)、(x2, y2)、(x3, y3)爲已知的點--起始點、結束點、頂點。最終的效果如下圖所示:

示例代碼:

1: package  

       2: {

       3:     import flash.geom.Point;

       4:     /**

       5:      * ...

       6:      * @author Meteoric

       7:      */

       8:     public class Parabola

       9:     {

      10:         private var startPt:Point;

      11:         private var endPt:Point;

      12:         private var vertexPt:Point;

      13:         

      14:         private var a:Number;

      15:         private var b:Number;

      16:         private var c:Number;

      17:         

      18:         public function Parabola(pt1:Point, pt2:Point) 

      19:         {

      20:             startPt = pt1;

      21:             endPt = pt2;

      22:             

      23:             parse();

      24:         }

      25:         

      26:         public function parse(waveHeight:Number=140):void

      27:         {

      28:             vertexPt = new Point(startPt.x + (endPt.x - startPt.x) / 2, endPt.y - waveHeight);

      29:             

      30:             var x1:Number = startPt.x;

      31:             var x2:Number = endPt.x;

      32:             var x3:Number = vertexPt.x;

      33:             

      34:             var y1:Number = startPt.y;

      35:             var y2:Number = endPt.y;

      36:             var y3:Number = vertexPt.y;

      37:             

      38:             b = ((y1 - y3) * (x1 * x1 - x2 * x2) - (y1 - y2) * (x1 * x1 - x3 * x3)) / ((x1 - x3) * (x1 * x1 - x2 * x2) - (x1 - x2) * (x1 * x1 - x3 * x3));

      39:             a = ((y1 - y2) - b * (x1 - x2)) / (x1 * x1 - x2 * x2);

      40:             c = y1 - a * x1 * x1 - b * x1;

      41:             

      42:             trace(a, b, c);

      43:         }

      44:         

      45:         public function getY(posX:Number):Number

      46:         {

      47:             var posY:Number = a * posX * posX + b * posX + c;

      48:             

      49:             return posY;

      50:         }

      51:         

      52:     }

      53:  

      54: }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章