[cocos2dx] マルチ解像度がよくわからない

2014年2月9日日曜日

• C++
• cocos2dx
• ゲームプログラミング
• プログラミング

この情報は間違っています! 訂正記事をこちらに記述しました。

　cocos2dxでは、マルチ解像度がサポートされています。しかし、マルチ解像度対応の解説ページや公式のドキュメントを見ても、いまいちしっくり来ません。
　普段開発は4インチのRetinaディスプレイ向けに行っているのですが、非Retinaなディスプレイで確認してみると一部描画が崩れる部分があったり、なんとなくマルチ解像度対応しているだけではうまくいかないなーと思ったので少しその辺を考えてみたいと思います。
　この記事は「こうすればいいよ！」といったものではなく、あくまで考察です。使用するバージョン等や環境によってはうまくいかない場合もありますのでご了承ください。

用語っぽいの

　公式ドキュメントに出てくる単語の意味がよくわからなかったので、図とかからこうじゃないかなー的な推測をしてみます。

• Resource Background Size
  　“リソース”とついていますが、実際には対象としたいスクリーンサイズだと思われます。対象としたいスクリーンサイズであって、実際のスクリーンサイズではありません。

• Design Resolution
  　デザイン時の解像度。PointやSize、Rect等で表現される座標やサイズの情報が、どの解像度用に使用されているかを指定するものです。

  　例えばPoint(20, 50)で表される座標があり、Design Resolutionが(320, 480)に設定されてた場合、Resource Background Sizeが(320, 480)の場合は(20, 50)、(640, 960)の場合は(40, 100)になります。
  　逆に、Resource Background Sizeが(640, 480)の場合、非Retina環境では(10, 25)となります。

• ContentScaleFactor
  　上記のResource Background SizeとDesign Resolutionの比率です。

  ContentScaleFactor = (Resource Background Size) / (Design Resolution)

  　実際には高さか幅の比率の小さいほうが採用されます。

  Resource Background Size	Design Resolution	ContentScaleFactor
  (320, 480)	(320, 480)	1.0
  (320, 480)	(640, 960)	0.5
  (640, 960)	(320, 480)	2.0
  (768, 1024)	(320, 480)	2.4

• Screen Size
  　実際の画面サイズです。デバイスによって異なります。setDesignResolutionSizeによって、デザイン時の画面をどのようにマッピングするか決めることが出来ます。

ContentScaleFactor

　前章のうち、ContentScaleFactorがやっかいです。まず、私の手元の環境ではContentScaleFactorを設定すると正しく描画されません。環境はcocos2dx 3.0 beta2です。マルチ解像度対応に関してまとめてあるブログ等では、

• setContentScaleFactor
• setDesignResolutionSize

の両方が設定されています。

参考:
　cocos2dxでマルチ解像度に対応させる | たそがれブランチ
　cocos2d-x マルチディスプレイに対応させる | studycocos2dx
　Multi resolution support | Cocos2d-x

　cocos2dxにはsetContentScaleFactorが2種類あり、一つはDirector(CCDirector)のsetContentScaleFactorで、もうひとつはEGLView(CCEGLView)のsetContentScaleFactorです。上記に挙げた参考サイト(最後のやつは公式ですが)では、どれもDirectorのsetContentScaleFactorを利用しています。

　DirectorのsetContentScaleFactorは、オブジェクトの描画スケールに影響を与えており、EGLViewのsetContentScaleFactor画面のスケールに影響を与えているようです。ただし、EGLViewのsetContentScaleFactorはResolutionPolicyがUNKNOWNの場合にのみ設定可能、つまりsetDesignResolutionSizeとsetContentScaleFactorは同時に使用できません。
　オブジェクトのスケーリングにはDirectorのgetContentScaleFactorを利用するのが正しいようです。

ContentScaleFactorは設定されるべき?

　私が思ったのはこれで、ContentScaleFactorは設定する必要があるのかどうか、という点です。ContentScaleFactorは、その名前からもわかるようにSprite等の描画スケールです。私はこの値をおもいっきり勘違いしていたのですが、どうやらsetContentScaleFactorは画像をディスプレイサイズによらずサイズを絶対指定するために使用するもののようです。つまり、ディスプレイサイズが変わったとしても本来の画像のサイズで描画するために使用するメソッドです。
　したがって、画面サイズに合わせて描画サイズも調整したい、そんなありきたりなシチュエーションの場合は、setContentScaleFactorは指定しないほうがいいようです。

結論

　わざわざ記事1つ作ってぐだぐだと書いてきましたが、結論は私の勘違いでした。ｻｰｾﾝ。いや勘違いというとアレですね、ネット上に落ちている情報を確認もせずにコピペするのはよくないですね。はい、よくないです。気をつけましょう。

結論2

　反省も重要ですが、もう少し有意義なまとめをば。
　setContentScaleFactorが利用されないとなると、Resource Background Sizeに相当するサイズの設定が不必要になる気がします。となると、やっぱり公式に貼ってあるコードがあまりいいサンプルではないなーと思うのですが、やっぱり何か勘違いしてるのかな…情報お待ちしております。