Flash Actionscript Physics Engine(APE) III about Roulette

基於上一個拆解  APE的DEMO中

右上角的小搖桿,把其想法做了一個   輪子(Wheel)及在上面釘一些點(pin)

並希望這些點可碰撞到一個針   讓這個針可在  被點碰撞到的情況做的小擺動

我們先做一個    由於這些點及輪子會一起連動所以使用了   Composite來把這些解構結合

程式如下:

  1: package comp
  2: {
  3:     import org.cove.ape.*;
  4: 
  5:     import ui.*;
  6: 
  7:     public class Wheel extends Composite
  8:     {
  9:         public function Wheel()
 10:         {
 11:             super();
 12: 
 13:             var wheel:WheelParticle=new WheelParticle(100, 100, 20, true);
 14:             var myWheel:ui.MyWheel;
 15:             wheel.setDisplay(myWheel=new ui.MyWheel());
 16:             wheel.alwaysRepaint=true;
 17:             //wheel.angularVelocity=0.0001;
 18:             //圓轉 結合的釘子不會動
 19: 
 20:             this.addParticle(wheel);
 21: 
 22:             var rCount:uint=0;
 23:             var number:uint=10;
 24:             var r:uint=360 / number;
 25:             for (var i:uint=0; i < number; i++)
 26:             {
 27:                 var X2:uint=Math.cos(rCount / 180 * Math.PI) * 80 + 100;
 28:                 var Y2:uint=Math.sin(rCount / 180 * Math.PI) * 80 + 100;
 29: 
 30:                 rCount+=r;
 31: 
 32:                 var pin:CircleParticle=new CircleParticle(X2, Y2, 2, true);
 33:                 pin.setDisplay(new ui.Pin());
 34:                 pin.alwaysRepaint=true;
 35:                 this.addParticle(pin);
 36:             }
 37:         }
 38:     }
 39: }
 40: 

Line 13~16:使用WheelParticle製作一個 輪子並由flash中指定一個  MovieClip給這個Particle

Line 22~36:在輪子上增加點(pin),目前增加20個點,使用三角涵數環繞擺放,並將flash中的MovieClip指定給各個點

以上即完成我們要的輪子

接著我們要在主場景上,放上一個針,這個針會由一個圓粒子去挓住這個針,讓它不會被地心引力帶著往下掉

  1: //needle start
  2:             var point1:CircleParticle=new CircleParticle(100, 180, 2);
  3:             
  4:             group2.addParticle(point1);
  5: 
  6:             var point2:CircleParticle=new CircleParticle(100, 220, 1, true);
  7:             
  8:             group2.addParticle(point2);
  9: 
 10:             var line:SpringConstraint=new SpringConstraint(point1, point2, 1, false, 0);
 11:             line.setDisplay(new ui.MyNeedle());
 12:             group2.addConstraint(line);
 13:             //needle end
 14: 
 15: 
 16: 
 17:             //Drag line start
 18:             var point_left:CircleParticle=new CircleParticle(100, 165, 0, true);
 19:             
 20:             group2.addParticle(point_left);
 21: 
 22:             var line_left:SpringConstraint=new SpringConstraint(point1, point_left, 0.01, true, 1);
 23:             
 24:             line_left.restLength=2;
 25:             group2.addConstraint(line_left);
 26:             //Drag line end
 

line 2~12為主要的針的解構

line 18~25為挓住針的解構(座標會在針的正上方)

  1: package
  2: {
  3:     import comp.Wheel;
  4: 
  5:     import flash.display.Sprite;
  6:     import flash.events.Event;
  7: 
  8:     import org.cove.ape.*;
  9: 
 10:     import ui.*;
 11: 
 12:     public class MyWheel extends Sprite
 13:     {
 14:         private var wheel:comp.Wheel;
 15: 
 16:         public function MyWheel()
 17:         {
 18:             super();
 19:             this.addEventListener(Event.ENTER_FRAME, run);
 20:             APEngine.init(1 / 4);
 21:             APEngine.container=this;
 22:             APEngine.addForce(new org.cove.ape.Vector(0, 2));
 23: 
 24:             var groupWheel:Group=new Group();
 25:             groupWheel.collideInternal=true;
 26: 
 27:             wheel=new comp.Wheel();
 28: 
 29:             groupWheel.addComposite(wheel);
 30: 
 31: 
 32:             var groupNeedle:Group=new Group();
 33:             groupNeedle.collideInternal=true;
 34: 
 35: 
 36:             //needle start
 37:             var point1:CircleParticle=new CircleParticle(100, 180, 2);
 38:             point1.visible=false;
 39:             groupNeedle.addParticle(point1);
 40: 
 41:             var point2:CircleParticle=new CircleParticle(100, 220, 1, true);
 42:             point2.visible=false;
 43:             groupNeedle.addParticle(point2);
 44: 
 45:             var line:SpringConstraint=new SpringConstraint(point1, point2, 1, false, 0);
 46:             line.setDisplay(new ui.MyNeedle());
 47:             groupNeedle.addConstraint(line);
 48:             //needle end
 49: 
 50: 
 51: 
 52:             //Drag line start
 53:             var point_left:CircleParticle=new CircleParticle(100, 165, 0, true);
 54:             point_left.visible=false;
 55:             groupNeedle.addParticle(point_left);
 56: 
 57:             var line_left:SpringConstraint=new SpringConstraint(point1, point_left, 0.01, true, 1);
 58:             line_left.visible=false;
 59:             line_left.restLength=2;
 60:             groupNeedle.addConstraint(line_left);
 61:             //Drag line end
 62: 
 63:             APEngine.addGroup(groupWheel);
 64:             APEngine.addGroup(groupNeedle);
 65: 
 66:             groupWheel.addCollidable(groupNeedle);
 67:         }
 68: 
 69:         private function run(event:Event):void
 70:         {
 71:             APEngine.step();
 72:             APEngine.paint();
 73:             wheel.rotateByRadian(0.02, new org.cove.ape.Vector(100, 100));
 74:         }
 75:     }
 76: }
 77: 

line 24~29 接下來 把我們做的輪子放上 (groupWheel)

line 32~60 針及拖曳線拼起來(groupNeedle)

line 60   這二個不同的Group知道彼此的存在做碰撞(Collision  detection)

line 73  不停的轉動輪子

P.S Collision detection  only apply for praticle

Flash Actionscript Physics Engine(APE) II

其中會選用這個工具是因為在其中一個Demo中,右邊這個被命名為SwingDoor的小組件,應該能等合,反抗地心引力(Gravity)的感受

Decompile 後SwingDoor的程式碼如下:

  1: //class SwingDoor
  2: package compcar
  3: {
  4:     import org.cove.ape.*;
  5: 
  6:     public class SwingDoor extends org.cove.ape.Group
  7:     {
  8:         public function SwingDoor(arg1:uint)
  9:         {
 10:             var loc1:*=null;
 11:             var loc2:*=null;
 12:             var loc3:*=null;
 13:             var loc4:*=null;
 14:             var loc5:*=null;
 15:             var loc6:*=null;
 16:             var loc7:*=null;
 17:             super();
 18:             collideInternal=true;
 19:             loc1=new org.cove.ape.CircleParticle(543, 55, 7);
 20:             loc1.mass=0.001;
 21:             loc1.setStyle(1, arg1, 1, arg1);
 22:             addParticle(loc1);
 23:             loc2=new org.cove.ape.CircleParticle(620, 55, 7, true);
 24:             loc2.setStyle(1, arg1, 1, arg1);
 25:             addParticle(loc2);
 26:             (loc3=new org.cove.ape.SpringConstraint(loc1, loc2, 1, true, 13)).setStyle(2, arg1, 1, arg1);
 27:             addConstraint(loc3);
 28: 
 29: 
 30:             (loc4=new org.cove.ape.CircleParticle(543, 5, 2, true)).visible=true;
 31:             loc4.collidable=false;
 32:             addParticle(loc4);
 33: 			
 34:             (loc5=new org.cove.ape.SpringConstraint(loc1, loc4, 0.02)).restLength=40;
 35:             loc5.visible=true;
 36:             addConstraint(loc5);
 37: 			
 38:             (loc6=new org.cove.ape.CircleParticle(550, -60, 70, true)).visible=true;
 39:             addParticle(loc6);
 40: 			
 41:             (loc7=new org.cove.ape.RectangleParticle(650, 130, 42, 70, 0, true)).visible=false;
 42:             addParticle(loc7);
 43:             return;
 44:         }
 45:     }
 46: }
 47: 
 48: 
 49: 

line 19-22 :loc1 : 棒子左邊的點(point),為不固定(fixed = false)

line 23~25: loc2:棒子右邊的點(point),為固定(fixed = true)

line 26~27:loc3: 棒子本身,利用loc1,及loc2串起棒子

棒子可因重物壓過即造成往下掉,和放開時,又往上彈,即時利用了以下二個元素

line 30~32:loc4:在loc1的正上方放即一個點為固定(fixed=true),並設不可碰撞(collidable=false)

line 34~36:loc5:把loc1及loc4用一條線串起來

其中loc4及loc5不希望使用者看到把是否可視設為不可見(visible=false)

line 38~39: 因棒子擺回的動作太大時會造成無法回到原定位,加了一個大球把棒子擋住

    

把loc4~loc7設為可見後,即可清楚其運作

接下應該有機會應用這個範例,加上一些自己的想法,運用在實際專案下,Good Luck

Car Demo Source Code

Flash Actionscript Physics Engine(APE) I

這個物理引擎算時是有點老

不過基於簡單原則,這幾天開始研究起這個工具,不過由於官網上的說明真的太少了

雖然說是簡單,但也花了二天找了一下相關的資源

首先當然就是官網  http://www.cove.org/ape/

資料真是少的可憐  只有二個Demo , As Doc ,及一個簡單到不可再簡單的Tutorial

這個引擎確實是簡單的多,主要的組成

1. 把引擎初始化
2. 設定在畫面上的物件
3. 設定群組並加入引擎
4. 讓引擎不斷重繪

真的就是這幾個步驟

另外這個引擎主要的元素也不多

1. CircleParticles
2. RectangleParticles
3. WheelParticles
4. SpringConstraints   -  稍微複雜的物件即可用這個元素拼出來
5. Grouping    - 更複雜的物件就用到這個元素
6. Collision

即然只有二個Demo,其實其中二個demo的內容還蠻值得參考的,不過因為未提供source

只好把它decompile一下,了解過內容對於基本的物理運動要求應該是可以達到的  ^_^

以下是幾個網上找到的資源,其中需要在該這些網多翻一些其它頁面,可以更多範例

• http://www.garrahan.org/ape_tutorials_Demo_wheel_brush.php
• http://www.emanueleferonato.com/2007/10/14/ape-actionscript-physics-engine-tutorial/
• http://blog.tudwaythecore.com/2008/09/creating-a-simple-ape-example/comment-page-1/#comment-4331
• http://www.comingx.com/?p=295
• http://www.comingx.com/?p=323