【cocos2d, iPhone アプリ】iPhone5, iPad miniのサポート

今まで3.5インチのRetinaディスプレイ(iPhone4, iPhone4S)用のデータしか用意していませんでしたが、そろそろiPhone5の4インチRetinaディスプレイ用のデータも用意したいと思います。
また、iPhone3GS以前の非Retinaディスプレイを捨てるとこのポストで書きましたが、非Retinaディスプレイの最新機種iPad miniの存在を忘れていました。
結局全てのデータを用意しなければならなくなりました。

スプラッシュ画面とタイトル画面用にこの絵を4インチ用の解像度である1136x640ピクセルのサイズで描きました。ファイル名をDefault-568h@2x.pngとします。

これを元に上下をトリミングした960x640ピクセルの画像ファイルを作り、Default@2x.pngのファイル名で保存します。それをさらに縦横半分のサイズに縮小したファイルをDefault.pngのファイル名で保存します。これでとりあえず全部です。これをXcodeのResourcesフォルダーに入れておけば起動時に機種に合わせて自動的に適切なファイルが選択されアプリ起動までの時間表示されます。

同じ画像をアプリのタイトル画面として使用します。アプリのタイトル画面はプログラムで機種を判別して適切な画像ファイルを選んであげる必要があります。私はこんな感じでCCDirectorのwinSizeとwinSizeInPixelsプロパティを使っていますが、他にも方法はあるようです。後述しますが、cocos2dにおいては"@2x"ではなく"-hd"をRetina用ファイルの識別子として使用します。

    CGSize size = [CCDirector sharedDirector].winSize;
    CGSize sizeInPixels = [CCDirector sharedDirector].winSizeInPixels;
    CCSprite* background;
    if (size.height != 480) {
        background = [CCSprite spriteWithFile:@"Default-568h@2x.png"];
    } else if (size.height != sizeInPixels.height) {
        background = [CCSprite spriteWithFile:@"Default@2x.png"];
    } else {
        background = [CCSprite spriteWithFile:@"Default.png"];
    }
    background.position = ccp(size.width/2, size.height/2);
    [self addChild:background z:0];

そして、アイコンも様々なサイズを用意する必要があります。
必要なのはこの8種類です。
Icon.png - 57x57 iPhone用アイコン
Icon@2x.png - 114x114 iPhone Retina用アイコン
Icon72.png - 72x72 iPad用アイコン
Icon-72@2x.png - 144x144 iPand Retina用アイコン
Icon-Small.png - 29x29 iPhone用アイコン小
Icon-Small@2x.png - 58x58 iPhone Retina用アイコン小
Icon-Small-50.png - 50x50 iPad用アイコン小
Icaon-Small-50@2x.png - 100x100 iPad Retina用アイコン小
これらを全てXcodeのResourcesフォルダーに入れたらinfo.plistファイルを編集します。
cocos2d 2.0のテンプレートから作成したこのプロジェクトの場合、iPad Retina用のファイルがinfo.plistに含まれていなかったので追加しました。

次にスプライト用テクスチャアトラスを作り直します。
TexturePackerの場合は次の設定をすると自動的にRetina用と通常用の2組のテクスチャファイルと.plistファイルを生成してくれます。

最後に背景画像を縦横半分に縮小したファイルを作成します。縮小する前のRetina用のファイル名には例えばstage1-0-hd.jpgのように"-hd"を付け、縮小した非Retina用のファイルには"-hd"をつけずstage1-0.jpgのようにします。
これによりcocos2dはRetina用と非Retina用のファイルを判別し適切な物を使用します。

プログラムでファイル名を指定する場面では次の例のように、"-hd"がついていない方のファイル名を使用します。

    CCSpriteFrame* frame = [[CCSpriteFrameCache sharedSpriteFrameCache] spriteFrameByName:@"missile.png"];