undefined

bokuweb.me

particle2dxで作成したエフェクトをcocos2d-JSで再生する

f:id:bokuweb:20150501212411g:plain

particle2dxで作成したエフェクトをcocos2d-JSで再生する方法です。 particle2dxはcocos2d用のエフェクトがブラウザ上でつくれちゃう優秀なやつです。 例えばこんなんが簡単にできます。

Cocos2d-html5 Hello World test

particle2dxでエフェクトを作る

particle2dx.com

Color&Shapeでパーティクルの形状やエフェクト開始・終了時のサイズやカラーなどを設定します。 形状は自分で作成したものをアップロードして使用することも可能。

f:id:bokuweb:20150501212824p:plain

Motionでパーティクルの生存時間や量、方向などを設定します。

f:id:bokuweb:20150501212934p:plain

プレビューを見ながら調整し、完成したらExportでplistとpngをダウンロードします。 "cocos2dx"のロゴをクリックするとplistが、"perticle_texture.png"をクリックするとpngがダウンロードできます。

f:id:bokuweb:20150501213114p:plain

cocos2d-JSで再生する

ダウンロードしたplistとpngファイルをリソースファイルに記述。

こんな感じで使用する。