ホームページ > 記事 > ウェブフロントエンド > JavaScript 拡張チュートリアル—組み込みパーティクル システム
クラス図から、Cocos2d-JS には 11 種類のパーティクルが組み込まれていることがわかります。これらのパーティクルのプロパティは、前のセクションで説明したプログラム コードで個別に変更することもできます。これらのプロパティの一部は例で実装されています。
組み込みパーティクル システム
11 の組み込みパーティクル システムは次のように説明されます:
ParticleExplosion。爆発するパーティクル エフェクト。半径モードに属します。
パーティクルファイア。火炎粒子エフェクトは重力パス モードに属します。
パーティクル花火。花火のパーティクル エフェクトは重力モードに属します。
パーティクルフラワー。花のパーティクル エフェクトは重力モードに属します。
パーティクルギャラクシー。ギャラクシー パーティクル エフェクト、radius モードに属します。
パーティクルメテオール。流星粒子エフェクト、重力モードに属します。
パーティクルスパイラル。半径モードに属する渦巻き粒子エフェクト。
パーティクルスノー。雪のパーティクル エフェクトは重力モードに属します。
粒子煙。煙のパーティクル エフェクトは重力モードに属します。
粒子太陽。太陽粒子効果は重力モードに属します。
パーティクルレイン。雨のパーティクル エフェクトは重力モードに属します。
これら11種類のパーティクルの特性は、その放出モードに応じて異なる効果をもたらします。
例: 組み込みパーティクル システム
これら 11 個の組み込みパーティクル システムを例を通して説明しましょう。この例を図に示します。 メニューを選択すると、選択したパーティクル システムの効果が下の図のアクション シーンに表示されます。右下の戻るボタンをクリックするとメニュー画面に戻ります。 // 操作フラグ
pLabel: null, This.flagTag = flagTag;
cc.log("MyActionLayer init flagTag " + this.flagTag);
var size = cc.director.getwinsize () ; Mlabel (BackMenuitem、this.Backmenu、this) ; 0; .nchor This.pLabel.x = size.width /2
this.pLabel.y = size.height - 50; this.addChild(this.pLabel, 3);
return true;
backMenu: function (sender) {
cc.director.
},
onEnterTransitionDidFinish: function () log("タグ = " + this.flagTag); var sprite = this.getChildByTag(SP_TAG);
var size = cc.director.getWinSize();
var システム。
switch (this.flagTag) { ②
case ActionTypes.kExplosion:
system = new cc.ParticleExplosion( );
this.pLabel.setString("爆発");
休憩。
case ActionTypes.kFire:
system = new cc.ParticleFire();
system.texture = cc.textureCache.addImage(res.s_fire); ③
this.pLabel.setString("Fire");
休憩。
case ActionTypes.kFireworks:
system = new cc.ParticleFireworks();
this.pLabel.setString("花火");
休憩。
case ActionTypes.kFflower:
system = new cc.ParticleFflower();
this.pLabel.setString("花");
休憩。
case ActionTypes.kGalaxy:
system = new cc.ParticleGalaxy();
this.pLabel.setString("Galaxy");
休憩。
case ActionTypes.kMeteor:
system = new cc.ParticleMeteor();
this.pLabel.setString("Meteor");
休憩。
case ActionTypes.kRain:
system = new cc.ParticleRain();
this.pLabel.setString("雨");
休憩。
case ActionTypes.kSmoke:
system = new cc.ParticleSmoke();
this.pLabel.setString("Smoke");
壊す;
case ActionTypes.kSnow:
system = new cc.ParticleSnow();
this.pLabel.setString("Snow");
休憩。
case ActionTypes.kSpiral:
system = new cc.ParticleSpiral();
this.pLabel.setString("スパイラル");
休憩。
case ActionTypes.kSun:
system = new cc.ParticleSun();
this.pLabel.setString("Sun");
休憩。 ④
}
system.x = size.width /2;
system.y = size.height /2;
this.addChild(システム);
}
});
var MyActionScene = cc.Scene.extend({
onEnter: function () {
this._super();
}
});
私たちは、MyActionLayer の onEnter ではなく、MyActionLayer の onEnterTransitionDidFinish 関数で粒子システム オブジェクトを作成します。関数数つまり、これは MyActionLayer の onEnter 関数が使用されているため、フィールドシーンも表示されず、この関数内で爆発などが表示される粒子システムが一度作成され、フィールドバックが表示される時点まで爆発が終了した場合、効果は見られません。
コードの②~④では 11 個のパーティクル システムが構築されており、ここではパーティクル システムの構築時に常にそれらの承認されたプロパティ値が採用されています。さらに、ウェブブラウザで粒子システムの追加処理を実行する必要がある場合、コードの 3 番目にのみ火の粒子処理を追加します。他の粒子処理の追加も同様です。