一起來玩鳥 Starling Framework（9）Particle

最後，來看看Starling裡一個很炫的功能：Particle。Particle屬於extension，所以要另外下載檔案：Starling-Extension-Particle-System。下載之後把檔案複製到Starling的source裡面就可以了。

Particle一樣需要工具，Mac的使用者可以用Particle Designer。$7.99美金，一樣可以拿來開發iOS的遊戲。另外ONEBYONE提供了一個線上的Particle Editor，可以線上測試效果，然後產生Starling需要的檔案。這個網頁開著似乎會讓我們發佈swf時看不到Starling的內容，如果有這種情形請關閉這個網頁試試看。

我們就使用Particle Editor來幫我們產生粒子效果。介面可以設定的項目很多，就請大家自己去玩。調出想要的效果後，在Demo效果的右邊有個SAVE Export Particle，點下去後會讓我們儲存一個particle.zip檔。

 

將這個檔案解壓縮，裡面有個particle.pex跟texture.png。particle.pex基本上也是個XML檔案，裡面記錄了Particle的設定；texture.png則是Particle用的基本圖像。然後就來看程式碼：

publicclassGame9extendsSprite
{
privatevar _container:Sprite;
[Embed(source ="/assets/particle.pex", mimeType="application/octet-stream")]
privatestaticconstParticleConfig:Class;//embed particle的設定檔
[Embed(source ="/assets/texture.png")]
privatestaticconstParticleBitmap:Class;//embed particle用的圖像

publicfunctionGame9()
{
super();
addEventListener(Event.ADDED_TO_STAGE, init);
}

privatefunction init(e:Event):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);

_container =newSprite();
addChild(_container);
addChild(newStats());

var bitmap:Bitmap=newParticleBitmap();
var texture:Texture=Texture.fromBitmap(bitmap);//將embed的圖片轉成texture
var xml:XML = XML(newParticleConfig());//將設定檔轉為xml

var particleSystem:ParticleDesignerPS=newParticleDesignerPS(xml, texture);//新增一個ParticleDesignerPS，將xml與texture傳進去
particleSystem.emitterX =300;//設定emitter座標
particleSystem.emitterY =300;//設定emitter座標
particleSystem.start();//開始particleSystem
_container.addChild(particleSystem);//加到場景上
Starling.juggler.add(particleSystem);//ParticleDesignerPS一樣是IAnimatable，要加到Starling.juggler才會跑
}
}

 
將particle.pex與texture.png embed進來，圖片轉成texture，設定檔轉成xml。接著新增一個ParticleDesignerPS的實體，將xml與texture傳進去。Particle系統有個emitter，用emitterX與emitterY設定座標，加到場景上，並且執行start()。ParticleDesignerPS也是實現IAnimatable介面的類別，因此最後要將它加到Starling.juggler才會跑。Demo如下：

 

點我或圖看Demo

Starling的基礎到此就完結篇啦，之後有更多的心得再來分享。