SpineをStarling1.7で使う:２種類のTextureAtlasに注意 の巻

7834 ワード
AIR flash ActionScript Starling Spine ActionScript テキストリンク

SpineのラインタイムもStarling2.0に対応してくれる予定だ( Starling v2 support : trelloのタスク )ということで、とても待ち遠しい訳なのですが、ライブラリのコア部分はStarlingが1.xだろうと2.0だろうと一緒で、描画周りのコードが変わるだけです。今のうちからStarling1.7で予習を始めようと思います。
(Starlingが最新でないのは、Spine公式サンプルで使っているのStarlingのバージョンに合わせたからです。)


とりあえず公式のデモソースを改造して動かしてみました。ここで実際に確認できます。２つ表示してもドローコールは１で、高速に動いてます。ちゃんとSpine最大売りのメッシュアニメにも対応していますね。すばらしきかな。

２種類のTextureAtlas

さて、いきなり最初からつまずく事実がいくつかあったので軽くまとめます。StarlingにはStarling仕様のTextureAtlasクラスが存在し、１枚のテクスチャに画像パーツを詰め込む用途で広く使われている訳ですが、SpineにはSpineの仕様のTextureAtlasクラスが存在します。

公式のゴブリンのデモでは、その２つの読み込み方をきりかえて使えるサンプルソースが用意されています。

  • Starlingアトラス初期化 (TexturePackerから書き出したもののようだ)

アトラス画像

アトラス定義ファイル https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-starling/spine-starling-example/src/goblins-mesh-starling.xml

sample.as
// Starlingアトラス 初期化部分を抜粋＆編集したソース
var texture:Texture = Texture.fromBitmap(new GoblinsStarlingAtlasTexture());
var xml:XML = XML(new GoblinsStarlingAtlas());
var starlingAtlas:TextureAtlas = new TextureAtlas(texture, xml);
var attachmentLoader:AttachmentLoader = new StarlingAtlasAttachmentLoader(starlingAtlas);
  • Spineアトラス初期化 (Spineツールから書き出したもの)

アトラス画像

アトラス定義ファイル https://github.com/EsotericSoftware/spine-runtimes/blob/master/spine-starling/spine-starling-example/src/goblins-mesh.atlas

sample.as
// Spineアトラス 初期化部分を抜粋＆編集したソース
var spineAtlas:Atlas = new Atlas(new GoblinsAtlas(), new StarlingTextureLoader(new GoblinsAtlasTexture()));
var attachmentLoader:AttachmentLoader = new AtlasAttachmentLoader(spineAtlas);
  • モーションデータ紐付けと実体化の共通部分
sample.as
var json:SkeletonJson = new SkeletonJson(attachmentLoader);
var skeletonData:SkeletonData = json.readSkeletonData(new GoblinsJson());
var skeleton:SkeletonAnimation = new SkeletonAnimation(skeletonData, true); // これがDisplayObject！
addChild(skeleton);

すでに登場人物（クラス）が多くて面食らいますが、公式サンプルソースでは、アセットをソースコードにEmbedしていますので、GoblinsStarlingAtlasTexture(Bitmap) 、GoblinsStarlingAtlas(Xml) 、GoblinsAtlasTexture(Bitmap)、GoblinsAtlas(Text)、これらは通常外部データとなる部分です。

また、SkeletonAnimationがDisplayObjectなので、ここから先は触っていて楽しい箇所になるかと思います。また、ここはStarling(ActionScript3)に限らずC#やC++でも同じクラス構成なので、一度覚えてしまえば、Unityでもcocosでも同じようなコーディングになるはずで安心です。

--

さて、一般的にはSpineフォーマット側のデータを使うサンプルが多いでしょうが、実際にディープに使う場合は、他の画像素材と１枚にまとめて扱う必要性など踏まえ、Starlingのアトラス形式を使ったほうがよいかもしれません。
Spineに読み込んでいる画像を別途テクスチャーパッカーなどでパッキングするといいでしょう。この際、サブフォルダの扱いなどで書き出しの食い違いが起きるかもしれないので、注意したほうがよさそうです。

とはいえ、入手しやすいデータはSpine形式のアトラスであるものが大半だと思うので、しばらくはSpine形式のTextureAtlasとお付き合いしてみようと思います。

さらにはまる

Spine形式のTextureAtlasをAssetManagr経由で読み込んで初期化しようとすると大きな問題がある事がわかりました。それは。。

次の投稿に続く。
SpineをStarling1.7で使う:AssetManager経由の初期化に苦労する の巻