【Unity】モバイルアプリの縦横両対応

botman_orange Unity
0

UnityHub-2.4.3 Unity-2020.3.6f1 macOS-11.2.1

はじめに

Unity でモバイルアプリを作成するときの画面の縦横両対応の方法についてです。

基本的にゲームアプリは縦か横で画面固定が多いのか両対応の方法が検索にひっかからなかったのでとりあえず動いた方法を記載します。もっといいやり方あれば教えていただけると幸いです。

何も考えずにやってると下記のように横向きにしたときにボタンや文字サイズが小さくなったので試行錯誤してみました。

before_landscape

完成品

完成品はこんな感じです。

landscape

ソース(GitHub)

方法

横向きのときに色々小さくなるのは下記のように Canvas Scaler を設定しているのが原因かと思われます。

  • UI Scale Mode
    Scale With Screen Size
  • Reference Resolution
    X: 720, Y: 1280(9 : 16)
  • Screen Match Mode
    Expand

canvas_scaler

Screen Match Mode とかをいじればいけるのかもしれませんがちょっとわかりませんでした。。。

横向きになったときに Reference Resolution を設定してやればいけるんじゃないかと思いついたのでその方法でやってみました。

方法は簡単。下記のスクリプトを作成して指定の Canvas に設定するだけです。

canvas

おわりに

無事、縦横両画面でいい感じに表示されました。ただ Update で毎回 referenceResolution を設定してやるのがいいのかはわかりません。。。

まだまだ Unity さわり始めたばかりなので下記の本で勉強中。

ステップアップUnity──プロが教える現場の教科書 WEB DB PRESS plus

新品価格
¥2,948から
(2021/5/3 20:11時点)

0

コメント

タイトルとURLをコピーしました