Unityでオブジェクトの描画順を変更する方法
Unityを使っていると前面に表示したいオブジェクトが他のオブジェクトの後ろに隠れてしまい、見えなくなってしまうことがあります。この記事ではオブジェクトの描画順を変更する方法をまとめています。
環境
- Unity 5.6.0f3
このページの構成
ポイント
- 描画順は3Dと2Dを分けて考えたほうが良い。
- 3Dの場合「各カメラのDepth」「カメラからの距離」をもとに描画順が決定される。
- 2Dの場合「各カメラのDepth」「SortingLayerとOrderInLayer」「z軸の値」をもとに描画順が決定される。
- 上記に関わらず、「ScreenSpace – Overlay」のCanvasは最前面に表示される。
- 3Dと2Dが入り混じっている場合（3DゲームのキャラクターとUIなど）の描画順は3Dの場合と考えて対処する。2Dオブジェクト(Sprite)間の表示順調整機能であるSortingLayerを変更しても表示順は変わらない。
カメラのDepthとLayerで描画順を変更する
- カメラを複数用意し、各カメラのDepthを変えることでカメラごとに描画順を設定することができる。
- Depthの値が小さいカメラから順に描画される。（Depthの値が大きいカメラに映っているオブジェクトが前面に描画される）
- 各カメラはCulling Maskに設定されたレイヤーのオブジェクトを描画する。
- Depthの値が大きいカメラ(前面に表示したいカメラ)のClearFlagsは「Depth Only」にしておく。(SkyboxやSolid ColorにするとDepthの値が小さいカメラの映像が塗りつぶされてしまう)
完成形
ここでは下のように、レイヤータグによってオブジェクトの描画順を切り替える方法を説明します。
前提
表示確認用に「YellowSphere」「GreenSphere」を用意しています。ともにtransform.position.zは0になっている（カメラからの距離が同じ）ため、くっついているように表示されている状態です。
レイヤーを追加する
① 表示順を変更するオブジェクト用のレイヤーを追加します。
前面に表示したいオブジェクトを選択し、inspectorから「Layer」-「Add Layer」をクリックします。
② レイヤー名を入力します。ここでは前面に表示する用のレイヤーとして「Depth0」、背面に表示する用のレイヤーとして「Depth-2」を作成しています。（デフォルトのメインカメラのDepthは-1になっています）。レイヤー名は表示順に影響しないので好きな名前をつけてください。
③ inspectorから前面に配置したいオブジェクトのレイヤーを変更します。ここではGreenSphereのレイヤーを「Depth0」に変更しています。
カメラを追加する
① 先ほど追加した「Depth0」「Depth-2」用のカメラを追加します。
Heararchyから「Create」-「Camera」を選択して新しいカメラを追加してください。ここではDepth0レイヤー（最前面に表示）用の「Depth0Camera」とDepth-2レイヤー（最背面に表示）用の「Depth-2Camera」を作成しています。
② 前面に表示したいレイヤー用のカメラ（Depth0Camera）の設定を変更します。
inspectorから「Clear Flags」を「Depth Only」に、「Culling Mask」に先ほど追加した前面に表示したいレイヤー（Depth0）を選択します。
参考:Unityマニュアル カメラ
③ 最背面に表示したいレイヤー用のカメラ（Depth-2Camera）の設定を変更します。
inspectorから「Clear Flags」を「Sky Box」に、「Culling Mask」に先ほど追加した背面に表示したいレイヤー（Depth-2）を選択します。
④ 中間に表示したいレイヤー用のカメラ（MainCamera）の設定を変更します。
inspectorから「Clear Flags」を「Depth Only」に、「Culling Mask」には前述した2つのカメラで設定されているレイヤー（Depth0,Depth-2）以外のレイヤーを選択します。
以上で設定は完了です。冒頭の「完成形」のようにタグを切り替えると表示順が変わるようになります。
SortingLayerとOrderinLayerで描画順を変更する
- 「Sorting Layer」「Order in Layer」は基本、Sprite間の描画順を変更する機能。
- SortingLayerが異なる場合、SortingLayers(SortingLayerを設定する項目)で並び順が下になっているレイヤーが前面に表示される。
- SortingLayerが同じ場合、Order in Layerの数字が大きいものが前面に表示される。
- Sprite以外にもParticleなどもSorting Layerで描画順を設定できる。
完成形
ここでは下のように、Sorting Layer,Order in LayerによってSpriteの描画順を切り替える方法を説明します。
前提
Unityを2Dモードにし、表示確認用に「RedSprite」「BlueSprite」を用意しています。transform.position.zの値はともに0にしています。
Sorting Layerを追加する
① 表示順を変更するSprite用のSorting Layerを追加します。
前面に表示したいSpriteを選択し、inspectorから「Layer」-「Add Layer」をクリックします。
② Sorting Layerを追加します。
ここでは前面に表示する用のSorting Layerとして「Front」、背面に表示する用のSorting Layerとして「Back」を作成しています。ここで上に設定されている項目は背面に、下に設定されている項目は前面に表示されます。順番はドラッグ＆ドロップで変更できます。
③ inspectorから前面に配置したいSpriteのSorting Layerを変更します。ここではBlueSpriteのSorting Layerを「Front」に変更しています。
以上で設定は完了です。冒頭の「完成形」のようにタグを切り替えると表示順が変わるようになります。
Order in Layerを変更する
① Order in LayerはSorting Layerが同じSpriteの描画順を設定する機能です。値が大きいSpriteが前面に表示されます。
inspectorから値を変更するだけなので説明は割愛しますが、変更すると下のように描画順を変更できます。
