kikki's tech note

技術ブログです。UnityやSpine、MS製品など技術色々について解説しています。

uGUIのPanelにuGUIとは違うオブジェクトを挟む

本章では、UnityでのuGUIの機能の一つ、CanvasのPanelを使ったTipsの紹介です。
PanelとPanelの間に、別のオブジェクトを挟む方法について、共有します。

UIとしてのuGUIでの並び順について

Unityに簡単にUIを実装するために、uGUIが用意されました。このuGUIを利用するために、Canvasを利用します。このCanvasで、以下の項目を調整することでオブジェクトの並び順を指定できます。

  • Sorting Layer
  • Order In Layer

しかし上記項目は、uGUIのCanvasで定義されたオブジェクトのみが対象となります。そのため、uGUIと関係がないオブジェクトを配置して並び替えを指定した場合は、並び順が保証されません。

そこでuGUIとその他のオブジェクトを併用した場合の並び順を指定する方法について、解説します。

uGUIとその他のオブジェクトの共存

CameraのDepthを設定

以下の図にある①③④のCanvasの間に、②のオブジェクトを配置する場合を検証します。
f:id:kikkisnrdec:20150702211540p:plain
まずCanvasとuGUIが関係がないオブジェクトの並び順を設定します。並び順は、Cameraの「Depth」を利用することで調整できます。以下の通り、Cameraを用意し、映すオブジェクトを指定しましょう。

  1. カメラ1:①のUI
  2. カメラ2:②のオブジェクト
  3. カメラ3:③④のUI

CanvasのOrder In Layerを設定

次に、uGUI内での並び順を指定するために、「Order In Layer」で並び順を設定します。これで調整が完了です。

総括

uGUIでUIの作成が簡単かつ便利になりました。ただuGUIと関係がないオブジェクトが、uGUIと連携が必要なった場合に、少し工夫が必要となります。uGUIは、デメリットを超えるメリットがありますので是非利用してみてください。
以上、「uGUIのPanelとPanelの間に、別のオブジェクトを挟む方法について」でした。

※無断転載禁止 Copyright (C) 2015 kikkisnrdec All Rights Reserved.