Cocos スプライトアトラス-オフラインのローカルツール、ブラウザでそのまま使える
グリッドまたは透明領域でスプライトシートのフレームを決め、同名の PNG と Cocos2d-x の plist を書き出します。
クリックして開く またはドラッグ＆ドロップ
PNG、JPG、WEBP、GIF
Ctrl/⌘+V で貼り付け。
準備完了。スプライトシートを開く、ドロップする、または貼り付けてください。
サンプルシートを試す
プレビューをクリックすると、この 5 フレームのホップ帯が読み込まれます。自動検出が各スプライトを印し、PNG と plist を書き出せます。
スプライトシートを開きます。行と列が数えられるときは 簡易グリッド、セルの幅・高さ・オフセット・隙間が分かっているときは 手動グリッド、透明ピクセルが各ブロックを分けているときは 自動 を使います。
重ね線がマスに合うまで調整します。空のセルを飛ばすと、完全に透明なマスを除けます。フレーム名は左から右、上から下の順です。Cocos Creator で SpriteFrame を Animation Clip に落とすときの並びと同じです。
書き出す ZIP には、同じベース名の PNG と format 3 の plist が入っています。両方を Assets にドラッグすると、Creator がアトラスと SpriteFrame の子リソースを作ります。サンプルレートと crossFade はエディタ側の設定です。このツールは .anim クリップを書きません。
Creator の Auto Atlas は、すでに分かれた SpriteFrame をビルド時にまとめます。AI が組んだ 1 枚のシートを切りはしません。この書き出しは、Creator が読み込める Cocos2d-x の plist と PNG の組です。