紹介するのは『Cocos Studio2』です。
これはスプライトシートを作成する専用のソフトではありません。
本職はあくまで開発環境なので、容量はかなり大きいです。
インストーラが732.3MB、インストール後のアプリのサイズは1.6GBあります。
でも無料で、ユーザー登録もなく、スプライトシートが作成出来るソフトはあまりないと思います。
特にMacでは。
『Cocos Studio2』はMac版、Windows版があります。
私はMacなので、Mac版での操作方法を説明します。
使用環境
私が使用している環境です。
- Mac OS X El Capitan Version 10.11.4
- Cocos Creator Version 1.0.1
- ブラウザ：Google Chrome Version 50.0.2661.86 (64-bit)
ダウンロード
ダウンロードは、下記のサイトからです。
Download Cocos2d-x, Cocos Creator and Cocos | Cocos2d-x
Windows版は、下のやつです。
インストール
ダウンロードした『CocosForMac-v3.10.dmg』を開いて『Install Cocos』をダブルクリックします。
『“Install Cocos”はインターネットからダウンロードされたアプリケーションです。開いてもよろしいですか？』と聞かれたら『開く』をクリックします。
『Install』をクリックします。
Macの管理者のユーザ名とパスワードが聞かれるので入力します。
下記の画面が表示されたらインストール完了です。
左上の閉じるボタンで閉じます。
スプライトシートの作成
さっそくスプライトシートを作成します。
アプリケーションフォルダの『Cocos』フォルダ内の『Cocos Studio 2』（『/Application/Cocos/Cocos Studio 2』）を開きます。
スプライトシートを作るには、アプリ開発用のプロジェクトファイルを作る必要があります。
『File』-『New Project...』をクリックします。
保存先だけ変更して、『Create』をクリックします。
プロジェクトファイルは、作業後は不要なので、わかり易い場所に保存います。
『File』-『New File...』をクリックします。
『Type』で『SpriteSheet』を選択し、『File Name』を入力して『New』をクリックします。
『Finder』から、スプライトシートにしたい画像ファイルをドラッグ＆ドロップします。
ファイルを削除する場合は、左下の『Resources』パネルでファイルを右クリックして、『Delete』をクリックし、『Move To Trash』をクリックします。
削除されるのは『プロジェクトフォルダ』に自動的にコピーされた画像ファイルです。
スプライトシートの設定と出力
右上の『Properties』で設定します。
| Size | 現在のスプライトシートの画像のサイズ |
| Allow Any Size | ２の乗数以外のサイズで良いか |
| Allow Clipping | 画像の透明部分を切り取って良いか |
| Maximum Size | スプライトシートの画像の最大サイズ はみ出た部分は出力されません。 |
| Type | スプライトシートの画像のファイル形式 pngまたはjpeg |
| Spacing | 登録した画像の間のスペース> アンチエイリアシング画像等の場合に設定 |
| Allow Rotation | スプライトシートのサイズを小さくするために 画像の回転を許可するか |
出力するには、『Export Sprite Sheet』ボタンをクリックします。
保存先を選択して『Open』をクリックします。
以上です。
作成したプロジェクトファイルは不要なので、フォルダごと削除して下さい。
あとがき
『Cocos Creator』には、スプライトシートを作成する機能がありません。
『Cocos Studio2』にはあったのに！
なので、スプライトシートを作成する時は『Cocos Studio2』を使っています。
