【Unity】モニターのアスペクト比に合わせてカメラサイズ(OrthographicSize)を調整する

残暑バテ

気温の高さが一向に収まらない所為か残暑バテで口内炎が4つも出来た不健康な皆さんこんにちは。加えて疲れが取れずに寝不足気味で昼食を食べると必ず眠くなるし、夕食後は「食べ終わったらゲーム開発しよう」と誓っても何故か寝そべってYoutubeを眺めたりするので残暑バテの影響は怖いです。ハイ、そこ「ただ怠惰なだけ」とか言わない。

ポスター制作

10月27日に開催される「東京ゲームダンジョン6」への出展準備として、今週は会場で掲げるポスターのデザイン作業を行っていました。

私自身は絵が全く描けないので背景画はniji journey先生にお願いして躍動感のあるビビットな絵を描いて頂きました。ありがとうございます。私の作業はこれにタイトルロゴとプロジェクト名を追加しただけ。本当に文明の進化ってありがたい。ちなみに中央に描かれているキャラクターはゲーム内では全く登場しません。

モニターサイズ

東京ゲームダンジョン6に出展予定の作品「Under A Groove」はPC向けの作品なので基本的に画面のアスペクト比を16:9として制作を進めているのですが、調べてみるとPCモニターのアスペクト比には16:9以外にも16:10もしくは3:2となっているものがあります。
特にMacBookでは16:10が採用されていたりするので、スマホ向け程ではないにせよPC向けゲームでもアスペクト比が異なるケースでの確認は必要となってきます。

UnityではuGUIを使用した画像、アイコンなどのUIに関しては画面のどこを基準に表示位置を決めるか設定できる為、アスペクト比が変わっても問題なく対処できますが、シーン内に配置したオブジェクトをカメラで捉えた映像についてはカメラのアスペクト比が表示するモニターに応じて変化するため、オブジェクトが見切れたり、逆に写り込んだりと想定外の映像となることがあります。

上の画像は16:9のアスペクト比で調整したゲームのタイトルシーンでタイトル文字も3D空間内に配置したTextMeshとなっています。

これを16:10に変えると

画面の横が縮んで縦の視野が広がるため、ズームアップしたような図になります。さらに3:2に変えると

タイトルの文字が見切れてしまいます。

カメラ(Orthographic)のサイズ変更

UnityのCameraはSize(orthographicSize)で表示範囲を設定する事ができます。
画面のアスペクト比に応じてこのSize(orthographicSize)を変える事ができれば、上のような見切れや写り込みといった問題を防ぐことが出来ます。

カメラのアスペクト比はCamera.aspectで取得することが出来るので、作成時のアスペクト比(16:9)でのカメラサイズを基準として、実行時に実際のカメラのアスペクト比(Camera.aspect)との割合を算出、その割合を基準サイズにかけ合わせた値を新しいカメラサイズとして設定します。

[SerializeField] private float BaseWidth = 1920;
[SerializeField] private float BaseHeight = 1080;
[SerializeField] private float BaseSize = 7;

public void Adjust_OrthographicSize()
{
    float baseAspect = BaseWidth / BaseHeight;
    float currentAspect = TargetCamera.aspect;

    float aspectRate = baseAspect / currentAspect;
    if (Mathf.Approximately(1.0f, aspectRate))
    {
        return;
    }

    Camera.main.orthographicSize = aspectRate * BaseSize;
}

上の処理を組み込んでモニターのアスペクト比を16:10に変えて実行した場合

3:2に変えた場合

どちらもモニターのアスペクト比が変わっても、オブジェクトの見え方は変わらず表示できること分かりました。

オブジェクトの位置調整

オブジェクトの見え方を一定とする事が出来ましたが、画面端に位置していたオブジェクトはアスペクト比が変わっても同じように画面端に配置しておきたいものです。
こういった場合、uGUIでの設定方法と同様に画面端からの相対位置が一定になるようにすれば対処できそうです。
画面端のワールド座標はCamera.ViewportToWorldPoint()を使うと取得できます。引数が(0,0)で左下、(1,1)で右上となります。

Camera.main.ViewportToWorldPoint(Vector2.zero);
Camera.main.ViewportToWorldPoint(Vector2.one);

上のスクリプトを実行して画面端の位置を取得すると、16:9での画面端座標は

となりますが、16:10に変更したときの画面端の座標は

となります。

カメラがOrthographicの場合、画面端のX,Y座標は常に一定なのでアスペクト比が変わった時の画面端位置の差分をオブジェクトの位置へ反映します。
試しに16:9のアスペクト比で位置を調整したタイトル文字に対して

アスペクト比を16:10の場合に16:9→16:10に変わった時の差分を座標に反映します

uGUIのようにアスペクト比が変わっても一定の位置に調整出来ていると思います。