ココのコイン落としではシーンに「コイン落としの台(3Dモデル)」「Live2Dモデル(3D?)」「UI(Image)」「台のスロット部分(Image)」「背景(Image)」を配置しています。
台モデルはカメラに俯瞰させつつ、Live2D、UI、スロット、背景は平行透視で配置したいです。更に、
「UI,スロット > 台モデル > Live2D > 背景」の順に描画順を整列させたいと思います。
CanvasにImageオブジェクトを入れると平行透視になるらしいので、Live2DとUIとスロットと背景をそれぞれCocoCanves、UICanvas、SlotCanvasに入れます。
描画順の決まり方は以下の通り。
- Hierarchyビューでは下にあるものが手前に表示されます。
- Sorting LayerはEdit > Project Settings > Tags and Layersから追加・並び替え出来ますが、下にあるものが手前に表示されます。
- 同じCanvas上にあるものはCanvasコンポーネントのPlane Distanceが小さいものが手前に表示されます。
- 同じレイヤにあるものはOrder in Layerの数字が大きいものが手前に表示されます。
- CanvasコンポーネントのRender Modeが「Screen Space – Overlay」だと最前面に表示されます。
今回はImage要素をCanvasに分け、各キャンバスを別のSorting Layerに分けます。Slotレイヤ、Cocoレイヤ、BGレイヤの順に表示されるようにレイヤを並べました。
また、コイン落とし台は普通にTransformで位置調整し、Canvasとの前後関係はCanvasのPlane Distanceで調整しました。
結果的に、
- UI(UICanvas)は「Screen Space – Overlay」
- スロット(SlotCanvas)は「Screen Space – Camera」でSlotレイヤ
- 台モデルは通常の配置方法による調整
- Live2D(CocoCanvas)はCocoレイヤに配置
- 背景(BGCanvas)は「Screen Space – Camera」でBGレイヤに配置
ところが何故かLive2Dモデルは最下部に表示されてしまいます。
原因を探っているとLive2DモデルのインスペクタにCubism Render ControllerでLayerという項目があるので手入力でCocoと入力すると無事に背景より手前に表示されました。
コメント