Canvas Scalerはとても便利ですが、久々に触ると毎回混乱します。
この記事ではなぜ使うのか？という目的に沿って必要な部分だけまとめてみます。
- 使わないと何が困るのか？
- 倍率が変わっても見た目が変わらないようにする
- アスペクト比が変わったときの挙動を制御する
- 壁紙的なものをいい感じに表示するShrink
- 絶対見切れないようにするExpand
- 参考
Unity2018.3.1
使わないと何が困るのか？
いま、こんな感じにUIを並べたとします。
画面サイズは500x1000で、それぞれのボタンの大きさは200x200です。
Canvas ScalerのUI Scale Modeは初期値のConstant Pixel Sizeです。
モバイル端末の解像度は端末によって大きく違うので、
試しにアスペクト比率を保ったままサイズを2倍の1000x2000にしてみます。
ボタンの大きさが200x200のままなので、相対的にボタンのサイズが小さくなってしまいました。
倍率が変わっても見た目が変わらないようにする
前節の問題を解決するにはUI Scale ModeをScale With Screen Sizeにします。
Reference Resolutionには最初にUIを並べて配置を決めた時の大きさを入力します。
今回は500x1000です。
すると、画面サイズが倍になったときにボタンのサイズも倍になるので、見た目上の大きさが変わらなくなります。
アスペクト比が変わったときの挙動を制御する
前節までの設定で、アスペクト比が変わらずにサイズが変わった時の見た目が制御できました。
次にアスペクト比が変わった場合を考えます。
アスペクト比が変わると当然レイアウトは崩れるので、
縦と横のどちらのレイアウトを優先的に保つかという考え方をする必要があります。
横のレイアウトを保ちたい場合はScreen Match ModeをMatch Width Or Heightにした上でMatchの値を0（Width）にします。
この状態でアスペクト比を変えてみるとこんな動きになります。
縦画面のアプリはこの設定にすることが多いかと思います。
若干わかりづらいですが、フッターメニューのようなものを置いてみれば
縦画面の場合こちらの設定が良い意味がよく分かります。
次にMatchの値を1（Height）にするとこのような動きになります。
横画面のアプリはこの設定にすることが多いかと思います。
壁紙的なものをいい感じに表示するShrink
Screen Match ModeをShrinkに設定すると壁紙的なものが良い感じに設定できます。
絶対見切れないようにするExpand
前節の壁紙をScreen Match ModeをExpandに設定して表示するとこんな感じになります。
絶対見切れさせたくないものに有効です。
参考
https://docs.unity3d.com/ja/500/Manual/HOWTO-UIMultiResolution.htmldocs.unity3d.com
