プロパティリストを利用する
cocos2d-xでは画像を表示する方法はいくつかあります。
今回、紹介するのはCCSpriteFrameCacheクラスを使った方法です。
この方法はプロパティリストに関連付けられた一枚の画像から、必要なモノを取り出して利用します。
読み込んだキャッシュから利用するので、画像を高速で表示することができます。
また、画像データをまとめられるので、サイズの節約にも繋がります。
画像を表示するための準備
CCSpriteFrameCacheクラスを利用するには、全容の画像とプロパティリストを作成する必要があります。これには専用のエディタを作成しないといけないのですが、私は「TexturePacker」の利用をお勧めします。
TexturePacker
有償のアプリケーションなんですが、cocos2d-x専用の画像とプロパティリストが簡単に作成できます。同時に、画像のサイズの圧縮もできます。
詳しくはこちらを参考にしてください。
TexturePacker – Create Sprite Sheets for your game!
CCSpriteFrameCacheクラスを利用する
画像が準備出来れば、実際に画面に表示をしてみましょう。今回利用する画像データはこんなものです。
画像データはこちらからお借りしました。
Cocos2d for Iphone 1 Game Development Cookbook

具体的なコードは以下のようになります。
【cocos2dx3.x】
//プロパティリストをSpriteFrameCacheを使い読み込む SpriteFrameCache::getInstance()->addSpriteFramesWithFile("Images.plist"); //読み込んだキャッシュから画像を取り出し、Spriteクラスとして利用する。 auto _spriteC = Sprite::createWithSpriteFrameName("button.png"); _spriteC->setPosition(Point(winSize.width/2,winSize.height/2)); this->addChild(_spriteC);
【cocos2dx2.x】
//プロパティリストを読み込む CCSpriteFrameCache::sharedSpriteFrameCache()-> addSpriteFramesWithFile("buttons.plist"); //読み込んだキャッシュから画像を取り出し、Spriteクラスとして利用する。 CCSprite*sprite = CCSprite::createWithSpriteFrameName("button.png"); sprite->setPosition(ccp(400,300)); this->addChild(sprite);
【結果】
コードの解説
//cocos2dx3.x SpriteFrameCache::getInstance()->addSpriteFramesWithFile("buttons.plist"); //cocos2dx2.x CCSpriteFrameCache::sharedSpriteFrameCache()-> addSpriteFramesWithFile("buttons.plist");
最初の一行目で、SpriteFrameCacheクラスを利用してプロパティリストを読み込んでいます。
ここで読み込まれた画像をSpriteクラスで利用しています。
経営育成ゲーム「わたしの動物園」をリリースしました!
cocos2dxを使って作成したアプリを作成しました。
無料で遊べますので、ぜひゲーム作りの参考にしてみて下さい!
【Sponsored Link】
更新履歴
- 2015年1月29日 : Jniを利用する
- 2015年1月27日 : デバックのための、ログの利用
- 2015年1月24日 : Android – 新規ファイルの追加と保存場所
- 2014年6月13日 : OSを判別する
- 2014年6月13日 : 効果音を再生する