conf t

インフラエンジニアのメモ

Unityでの複数解像度対応(見切れないように位置を調整する)

f:id:monaski:20150517144817j:plain:w300

前回解像度の違いにより、ボタンが小さくなる問題への対処をしました。

monaski.hatenablog.com

CanvasのCanvasScalerの調整機能により、画面解像度によってボタンなどの部品の大きさを
大きくor小さくしてくれるのでしたね。

今度は大きさの問題ではなく、配置の問題が出てきました。

Nexus7文鎮化後に新しい端末(Xperia)を買ってきて、同じゲームをデバッグして気づいたんですが、
画面端のスコアが見切れてしまっていました。

f:id:monaski:20150517144817j:plain:w300

Nexus7はfullHDで買ってきたXperiaがHDだったんで解像度の違いによるものと思われます。

このようにAndroid用に開発する際は、解像度への対応は必ず必要になってくるわけですが、
実機じゃなくUnity上でも解像度の変化でどのように画面が変化していくかを確認できます。
f:id:monaski:20150517151646j:plain:w300
Gameの左の解像度のメニューで解像度を変えることで確認できます。
FreeAspectにすれば、マウスでぐりぐり動かして、どのように画面が変わっていくかを見れます。
確認したところ、やはりスコアが見切れる場合がありますし、タイトル画面のボタンまで見切れてしまうことがあるようです。

これに対する対処として、Anchorというものを使います。
f:id:monaski:20150517145946j:plain:w300
上図ではハイスコアテキストのアンカーは、画面中央に設定されております。

f:id:monaski:20150517150008j:plain:w300
そして、中央のアンカーから、PosX, PosYの位置にハイスコアは配置されます。
そしてこの調整は絶対値で調整されます。

f:id:monaski:20150517145706j:plain:w300
そのため、このPosX, PosYの値が画面解像度より大きいと、はみ出してしまうのです。

そこで、アンカーを画面右上端に変更します。
f:id:monaski:20150517150356p:plain:w300
すると、Sceneのアンカーアイコンが画面右上端に移動し、さらに、PosX, PosYが自動で変化します。
先ほどまでの画面中央からゲームオブジェクト(ハイスコアテキスト)までの距離から、
画面右上端からゲームオブジェクトまでの距離に変わったためです。

f:id:monaski:20150517150742j:plain:w300
以上のように、解像度変化時のオブジェクトの位置調整の基準位置(アンカー)を、 画面中央から、画面端に移動することで画面解像度が下がっても、見切れることはなくなりました。