複数の解像度に対応する〜ResolutionPolicy〜

前回に続いてcocos2dxでの解像度対応について。

前回では解像度に合わせて画像リソースを変更するやり方について書いたが、今回は異なるアスペクト比の機種に対しての対応の仕方についてまとめた。

1.主なアスペクト比

iOS端末のアスペクト比（横幅：縦幅）は

• iPhone4系(2:3) = 1.5

• iPhone5,6系(9:16) = 1.77

• iPad系(3:4) = 1.33

である。Android端末についてもほとんどがこのどれかだろう。

iPad系とiPhone5,6系ではおよそ1.3倍もの差がある。iPhoneとiPadを同時に開発する際には注意しないとかなりのずれやゆがみができてしまう。

2.ResolutionPolicy

異なるアスペクト比に対してどのように画面サイズを合わせるかを設定するのがResolutionPolicyである。ResolutionPolicyの設定は前回AppDelegate.cpp内のapplicationDidFinishLaunching()内で追加した、

glview->setDesignResolutionSize(designResolutionSize.width, designResolutionSize.height, ResolutionPolicy::SHOW_ALL);

で行う。第1,2引数では、どのアスペクト比で画面を作成するかを設定する。今回ではiPhone6の解像度を用いている。
第3引数のResolutionPolicy::SHOW_ALLの部分は主に3種類ある。例を挙げてそれぞれを説明する。今回は以下の750x1334iPhone6サイズの画像をiPhone4Sで表示した。

1 SHOW_ALL

SHOW_ALLはアスペクト比を保ったまま、画面内に全てが表示できるように調節する。ゆがみがなく、はみ出す部分もないが何も表示されない黒いエリアが左右にできてしまう。

2 NO_BORDER

NO_BORDERはアスペクト比を保ったまま、画面に黒いふちが出ないように調節する。ゆがみがなく、画面全体に表示されているが、よく見ると上下が画面外にはみ出てしまっている。

3 EXACT_FIT

EXACT_FITは画面全体に表示できるよう画像を引き延ばして表示する。はみ出す部分もなく黒い縁もないが、左右に引き延ばされてしまっている。

3.まとめ

ResolutionPolicyにはそれぞれ一長一短がある。様々な機種で同じような画面を表示するには、歪ませてもいいのか、はみ出してもいいのかなどを開発を始める前に決めておくことが重要だと思う。開発が進んだ後からどうにかしようとすると、画像の配置などを直さなくては行けなくなり困ることになる。