画面解像度とスケーリング

 

様々な画面サイズや縦横比に対応する方法の説明

Canvas Scalerコンポーネント

どのような画面サイズや縦横比でUnityアプリケーションが実行されるかはユーザの環境や設定により変わってしまいます。このためUnityアプリケーションでは様々な画面サイズや縦横比にUIを対応させなくてはなりません。 様々な画面サイズや縦横比へUIを対応させるにはUIの位置や大きさを実行環境の画面に合わせて拡大縮小する必要があります。この拡大縮小処理は Canvas Scaler コンポーネントで行うことができます。Canvas ScalerコンポーネントはCanvasオブジェクトが作成される際に自動的に取り付けられています。

Canvas Scale Mode

Canvas ScalerコンポーネントのCanvas Scale Modeプロパティで拡大縮小の動作を設定します。Canvas Scale Modeは以下のモードを設定することができます。

Constant Pixel Sizeモード

UIの位置や大きさをピクセルに対する単純な倍率で指定するモードです。Canvas Scalerコンポーネントの Scale Factor プロパティで画面の倍率を指定します。Scale Factorが1の場合はUIの位置はそのまま画面上のピクセルに対応します。たとえば(100,400,0)という位置は画面の中心から100ピクセル右の400ピクセル上になります。

Constant Pixel SizeモードではScale Factorが1のままでは画面サイズが変更されると画面に対するUIの位置と大きさが変わってしまいます。たとえば、画面サイズが上下に800ピクセルの場合(0,400,0)は画面の上端ですが、画面サイズが上下に600ピクセルの場合(0,400,0)は画面の外にでてしまいます。そこでScale Factorプロパティに0.75(=600/800)を設定することで、UIの位置と大きさが0.75倍になり画面サイズが上下に600ピクセルの時に(0,400,0)を画面の上端とすることができます。

Constant Pixel Sizeモード
Constant Pixel Sizeモード

Scale With Screen Sizeモード

Scale With Screen Sizeモードは画面サイズによってUIの位置や大きさにスケールをかけます。まず基準となる解像度を Reference Resolution プロパティに設定します。UIの位置やサイズはこの基準解像度での見え方で設定します。たとえばReference Resolutionプロパティが(640,480)であれば、(-320,240)が左上の位置となり、右下が(320,-240)となります。UIの大きさが160x160であれば画面の横幅の1/4の大きさになります。画面サイズがどうであれ縦横比が(640,480)と同じ4:3であれば同じ見え方になります。 画面縦横比がReference Resolutionと異なった場合にどのように合わせるかは Screen Match Mode プロパティによって設定します。 Screen Match ModeがMatch Width or Heightのときはゲーム画面の横幅あるいは縦幅にCanvasのReference Resolution領域が合うようにスケールされます。MatchスライダーをWidthに合わせれば横方向、Heightに合わせれば縦方向に合わせます。またその中間も選べます。

Match Width or Height
Match Width or Height
Match width or Height でMatchスライダーをHeightに合わせたときの例
Match width or Height でMatchスライダーをHeightに合わせたときの例

Screen Match ModeがExpandのときはCanvasのReference Resolution領域がGameビュー画面に内包されるようにスケールされます。

Expand
Expand
Expandの例
Expandの例 - Reference Resolution領域はゲーム画面に内包される

またScreen Match ModeがShrinkのときはゲーム画面がCanvasのReference Resolution領域に内包されるようにスケールされます。

Shrink
Shrink
Shrinkの例
Shrinkの例 -ゲーム画面がReference Resolution領域に内包される

広告