すくまりのメモ帳すくまりのメモ帳
← 記事一覧に戻る

【Unity】Canvasより手前にオブジェクトを設置してリザルト画面を作成する方法

【Unity】Canvasより手前にオブジェクトを設置してリザルト画面を作成する方法

はじめに

この記事ではCanvasより手前にオブジェクトを設置する方法を紹介します。

Canvasのおすすめ初期設定

Canvasとは、スコアや画像の表示、ボタンといった、ユーザーインターフェース(UI)系の役割を果たすオブジェクトです。

UIの使いやすさはゲームの持続率に直結します。

まず、ヒエラルキーにCanvasを設置します。

GameObject > UI > Canvas で設置してください。

すると、Canvas とEventSystem が生成されます。

このEventSystemは、ユーザーのテキスト入力やボタンの操作などの行動を、

Canvasへ橋渡しするものです。

通常、EventSystemは変更する必要がないので、無視してかまいません。

解像度の設定

Canvas Scaler コンポーネントのUI Scale Mode を「Scalse Eith Screen Size」に変更してください。

すると、Reference Resolution という項目が現れるので、「X:1280」、「Y:720」に変更してください。

この1280×720 は16:9 のアスペクト比でスマホの画面に適した大きさになります。

縦長の画面にしたい場合は720× 1280は9:16にしてください。

続いて、Screen Match Mode を「Match Width Or Height」にしてください。

これで、iPadなどの画面が大きいデバイスでも、自動でUIが拡大されます。

縦長の画面の場合はMatchのスライダーをHeightに変更してください。

Gameウインドウの設定

Gameウインドウのアスペクト比を16:9(縦長の場合は9:16)へ変更してください。

これで解像度の設定は以上です。

オブジェクトをCanvasより前に移動させる方法

この白い枠がScene上のCanvasになります。

もし、2Dの画面になっているならば、2Dボタンを押してSceneビューを3Dに切り替えてください。

すると、右上にシーンギズモが現れ、画面が3D用の編集画面になります。

ここで試しに、左から Camera → Cube → Canvas の順番で配置して、

ヒエラルキーのCanvas上で右クリック、UI → Text でTextを配置してGame画面中央に持ってくると以下のようになります。

このように、Gameウインドウ上ではUIであるCanvasが常に全面にくるため、オブジェクトより前にテキストが現れます。

CanvasコンポーネントのRender Mode を「Screen Space - Camera」に切り替えてください。

続いて、Render Camera にヒエラルキー上のMain Camera をドラッグ&ドロップしてください。

これでシーンの配置通りの順番でゲーム画面に表示されます。

カメラとCanvasの位置を調製するときは「Plane Distance」の値を変更してください。

これで、以下のような画面が作成できます。

忙しい人のためのUnity入門講座へ戻る