読者です 読者をやめる 読者になる 読者になる

ゆにてく備忘録

Unityやその他学んだ事を忘れないために書くぶろぐ

uGUIチュートリアル まとめ1 UI CANVAS

目次

UnityのuGUIのチュートリアルのまとめです.


UI Canvas - Unity Official Tutorials - YouTube

Canvas(キャンバス)

f:id:n_taku:20150311104550p:plain

f:id:n_taku:20150311111831p:plain

Render Mode(レンダリングモード)

以下の三つがある.

  • Screen Space-Overlay
  • Screen Space-Camera
  • World Space

Screen Space-Overlay

f:id:n_taku:20150311111824p:plain

  • キャンバス標準のレンダリングモード
  • UIをシーンの最前面に配置
  • Canvasのサイズは自動的に最大画面サイズにするので,Rect Transformは画面いっぱいとなるように自動で設定される
  • Pixcel Perfectにチェックする事で,レンダリングの際に最も近いピクセルに調整される(UIをシャープにできる)

Screen Space-Camera

f:id:n_taku:20150311111814p:plain

  • Screen Space-Overlayに似ている設定
  • このCanvas設定のUIはシーンにある特定のカメラでレンダリングされる
  • カメラ固有の設定(マスク,カリングカメラ,デプスチ)を使ってスクリーン空間のUIを表示できる
  • 使い方としては,遠近二つのカメラを用意して,UIに奥行きを持たせる事ができる
  • Canvasのサイズは設定したカメラのビューポートいっぱいとなるように自動で設定される
  • Screen Space-Overlayと同様にPixcel Perfectの設定ができる
  • Render Camera(UI要素をレンダリングするカメラ)を設定しない時,Screen Space-Overlayと同じ設定となる
  • Render Cameraを設定する事でシーンビュー内のオブジェクトを相対的に描画する事ができる.つまり3Dのオブジェクトの位置によってはUIの上に描画できる

World Space

f:id:n_taku:20150311111819p:plain

  • シーン内の静的オブジェクト,吹き出し,プレイヤーを追跡するタグなどを表現できる
  • Canvasはシーンのどこにでも設置できる(Rect Transformを使わない).
  • Event CameraはUI要素をクリックするなどのイベントを受信するために必要となるカメラ(たいていはmainカメラ)を設定する
  • イベントを受信すると,このCanvasのUIがクリックやホバーのようなイベントを実行する
  • ビデオにあるReceives Eventは無駄だからInspectorには表示されなくなった

他の共通プロパティ

Sorting Layer
- レンダリングの際の描画順を設定できる.Layerの上から下の順にレンダリングしていく
Order in Layer
- 同じレイヤーでの描画順を設定できる.数が大きいほど出前に描画される

Canvas内での複数UIの描画順

f:id:n_taku:20150311123557p:plain

Hierarchie内で上から下に描画していく.上の写真でいうとbutton frontが手前に描画される