はじめに
今回はUnityを使ってスマホ向けアプリを作成した際にUI崩れが起きてしまう問題に対して簡単な設定で解決できたのでそれをメモとして残します。
画面サイズによってUIが崩れる問題
初めてUnityでスマホアプリをビルドしようとしたときに画面比を変更すると誰もが「UIが崩れてる...」「これまでのボタン位置の調整は無駄だったってこと？...」と落胆した経験があると思います。
具体的には以下の動画のような現象です。
⬇︎期待している配置
⬇︎画面サイズ変更で崩れる様子（絶望）
解決策
CanvasについているコンポーネントのCanvasScalerを「ScaleWithScreenSize」に変更することで画面比に合わせてUIの大きさを自動で調整してくれるようになります。
まとめ・おわりに
AssetStoreにあるものを使用する必要があると思ったのですが調べてみると簡単な設定で解決でき驚きました。過去に自分で作成したゲームをスマホで遊ぼうとした際、毎回UIの崩れが気になっており、もやもやしていましたが今回それが晴れてよかったです。
今更ですが過去に忘備録として残したwebブラウザ向けゲームの画面崩れの記事で記載した対処法と同じ対処法でした笑。「UI崩れ＝CanvasScaler設定漏れ」と忘れないようにします。