[Cocos2d-x] Cocos Studioについてのまとめ
基本
各種アニメーションの設定やGUI要素の構築をWYSIWYGで行える無料の公式エディタ。
有償のものと比べると見劣りする部分もあるが、全体として必要十分。
以前は「CocoStudio」という名前でWindows向けにしか提供されていなかったが、今ではMacでも使えるようになった。
このエディタそのものは、オープンソースではない。
バージョン
メインは1.x系。
2.x系がすでにリリースされ、betaの文字も名前からとれているが、「UI Editor」しか実装されておらず、実際には開発途上。
出力ファイルにはエディタのバージョンが記録されていて、後方互換性はあるが、逆はないので、新しいバージョンで出力したものを古いエディタで読み込むことはできない（同じ1.x系でも）。
1.x系
1.3の頃くらいまでは「CocoStudio」という名称だった。
キャンバス部分（編集部分）のフレームレートが高いのか、残念ながらやや重い。
出力ファイルはJSON。
2.x系
処理は軽くなった。
出力ファイルは、拡張子が「.csb」の独自バイナリ。
現状、「UI Editor」しか実装されておらず、しかもそれですら1.x系の頃にはあった機能の一部が未実装。
全体としてまだまだ不安定で、最新版のCocos2d-x C++ですらうまく読み込めないこともある。
正直、なぜツールが一通りそろっていた1.x系の開発をやめてまで移行したのかよくわからない。
注意点
Windows版では、スタートメニューの「プログラム」メニューなどで、1.x系の項目と2.x系の項目が混在してしまうので注意。
基本的にバージョンの上下ではなく、最後にインストールしたバージョンのもので上書きされる。
確実に呼び出したいなら、1.x系は「Cocos Studio」、2.x系は「Cocos」という項目をクリックし、メニュー画面を表示させてそこから各種ツールを選ぶといい。
なお、以前のバージョンである「CocoStudio」はそのままになる（1.3くらい）。
内部ではそれぞれ別のところにインストールされるので混在OKだが、アンインストールは自分でやる必要がある。
各種ツール
Cocos Studioとは、以下のツール群の総称。
UI Editor
extention（拡張機能）にあるGUIライブラリを利用して、WYSIWYGでグラフィックの構築ができる。
パーティクルや画像の配置も可能。
アニメーション機能
簡易的ではあるが、各ウィジェットをアニメーションさせることもできる。
タイムラインのエディタがあり、FlashやAfterEffectsと似た感覚で操作・プレビューが可能。
Scene Editor
その名のとおり、Cocos2d-xのSceneを構築するためのエディタ。
基本的にはUI Editorと似ているのだが、以下のAnimation Editorで作成したものを配置したり、BGMを指定できたりする。
プレビュー＝実際の動作の確認も、手軽に高速にできる。
RPGツクールのエディタのように、「TouchEndedのときに～の処理をする」といった感じで、GUI上でイベント処理の設定も一部できる。
Animation Editor
最近スマホゲームでよく見かける、キャラなどをなめらかにアニメーションさせるためのエディタ。
いわゆるスプライトアニメーションのためのエディタ。
基本的には、FlashやSpriteStudioと同種のもの。
ボーンやIKにも対応している。
Game Data Editor
「キー：値」という連想配列やKVS的な、単純な組み合わせのデータをつくるためのツール。
既存の表計算ソフトのデータ（ExcelやCVS形式）を読み込んで表示させる。
JSON形式に出力される。
残念ながら、現状、入力も出力もうまく動かない。
ソースコードでの読み込み
以下は、3.x系のCocos2d-x C++、Cocos2d-JS（Cocos2d-html）の場合だが、基本的には他の言語でも同じ。
UI Editor
1.x系
【Cocos2d-JS】（Cocos2d-html）
「ccs.uiReader」を使う。
var panel = ccs.uiReader.widgetFromJsonFile("sample.json");
node.addChild(panel);
2.x系
【C++】
auto panel = CSLoader::getInstance()->createNodeFromProtocolBuffers("sample.csb");
node->addChild(panel);
【Cocos2d-JS】
＊ Cocos2d-html
var panel = ccs.load("sample.json");
node.addChild(panel);
（以下は、Cocos2d-htmlの古いバージョンについて）
v3.2以下では、「非対応」。
v3.1以下では一応コードは書かれていたが、うまく動作していなかった。
よって、Cocos2d-htmlでも使うことを前提にするなら、Cocos Studio 1.x系を使うしかない。
感想
いろいろと使いづらい部分はあるものの、「無料でここまでできるなら十分」と思わせられる。
こういったところも、Cocos2d-xが人気の理由だろう。