UGUI Canvas

Canvas 組件(Component)為 UGUI 中的根本，主要用來渲染自己的所有 UI 組件。UI 組件必須要為 Canvas 組件的子組件才可正常顯示。

Render Mode

UI 渲染方式有以下三種

• Screen Space - Overlay(預設)：螢幕空間，覆蓋模式，
  • UI 始終顯示在場景(Scene)內容前方。
  • Pixel Perfect：是否開啟無鋸齒精確渲染，性能換效果，當勾選時會有較好的 UI 顯示，但是較耗費性能
  • SortOrder：排序層編號，用於控制多個 Canvas 時的渲染先後順序。該值越高顯示越前面
  • Target Display：目標裝置，在哪個裝置上顯示。
  • Additional Shader Channels：其他著色器通道，決定著色器可以讀取哪些資料。
• Screen Space - Camera：螢幕空間，攝影機模式，
  • 3D 物體可以顯示在 UI 之前。
  • Render Camera：用於渲染UI的攝影機，如果不設定，則會類似於覆蓋模式
    • 一般不建議直接使用主攝影機去渲染 UI
  • Plane Distance：UI 平面在攝影機前方的距離，類似整體 Z 軸的感覺。值越小該 Canvas UI 越靠近攝影機。
  • Sorting Layer：Canvas屬於的排序層，可在 Edit -> Project Setting -> Tags and Layers -> Sorting Layers 進行新增與編輯，越下方的層顯示越前面
  • Order in Layer：Canvas在所屬排序層下的順序，該值越高顯示越前面
  • 例如角色狀態，一般會選這種模式，因為玩家角色物件要顯示在 UI 前面。
• World Space： 世界空間，3D模式。
  • Event Camera：用於處理 UI 事件(Click、Drag)的攝影機。如果不設定，不能正常註冊UI事件，有就是說如果沒設定則像是 Click 事件就無法正常使用。
    • 一般使用主攝影機
  • 把 UI 當作 3D 物件，可以圍著人物或其他物件旋轉，移動。

Reference:

• https://www.bilibili.com/video/BV14N411Z7Fz?p=3&vd_source=f103d4eb21cc24456defbcf356882852