Canvas Component 是UI布局和渲染的抽象空間，所有的UI都必須在此元素之下(子物件)，簡單來說 Canvas 就是渲染 UI 的組件

Render Mode

UI渲染的方式，有以下三種

• Screen Space – Overlay：螢幕空間 – 覆蓋

• Screen Space – Camera：螢幕空間 – 攝影機

• World Space：世界座標空間

在此模式下不會參照到Camera，UI直接顯示在任何圖形之上

• Pixel Perfect：可以使圖像更清晰，但是有額外的性能開銷，如果在有大量UI動畫時，動畫可能會不平順

• Sort Order：深度值，該值越高顯示越前面

使用一個Camera作為參照，將UI平面放置在Camera前的一定距離，因為是參照Camera，如果螢幕大小、分辨率、Camera視錐改變時UI平面會自動調整大小。如果Scene中的物件(GameObject)比UI平面更靠近攝影機，就會遮擋到UI平面。

• Render Camera：用於渲染的攝影機

• Plane Distance：與Camera的距離

• Sorting Layer：Canvas屬於的排序層，在 Edit->Project Setting->Tags and Layers->Sorting Layers 進行新增，越下方的層顯示越前面

• Order in Layer：Canvas屬於的排序層下的順序，該值越高顯示越前

把物體當作世界座標中的平面(GameObject)，也就是當作3D物件，顯示3D UI

• Event Camera：處理UI事件(Click、Drag)的Camera，所設定的Camera才能觸發事件

※通常用於角色的血條顯示、ID顯示、角色頭上對話框

大局觀來看的話這兩個componet都是放入圖片顯示圖片的功用，但是基本上，大部份情況都是使用Image，如果有以下情況，可以考慮使用Raw Image:

• 不想使用Sprite來設定圖像，直接使用texture來設定，例如在網路下載的圖片或者是RenderTexture

• 想使用不同類型的Texture

• 想自行調整圖像的uvRect // 這是RawImage獨有的屬性

Simple:

• 默認的設定，使用上比較簡單；

• 適合：遊戲背景，圖示，對話框背景，一般圖像

• 注意事情：

  • 修改時，Width/Height會令圖片變形，但可以使用“Preserve Aspect”來避免變形；

  • 如圖像(Texture)需要高Resolution時，可利用Texture Compression和16bit圖像來提昇效能；

• 一般來講處理文字會有三種方案，Text、TextMeshPro、ImageText

• Text : 是最傳統的文字泛用性高，但是造型變化低

• TextMeshPro: 是新版的文字，可以變化的效果多，也能應付多語言，但是在圖檔的資源消耗非常大。

• ImageText: 就是用圖檔來切圖製作的，可以做很多藝術字，相對的泛用性很低

• 一般來講處理文字會有三種方案，Text、TextMeshPro、ImageText

• Text : 是最傳統的文字泛用性高，但是造型變化低

• TextMeshPro: 是新版的文字，可以變化的效果多，也能應付多語言，但是在圖檔的資源消耗非常大。

• ImageText: 就是用圖檔來切圖製作的，可以做很多藝術字，相對的泛用性很低

• 基本上，TextMeshPro的功能比較Text好，可以做很多效果，但使用TMP需要考量最重要的一點，效能上的消耗，TMP的原理是透過生成一張字形貼圖，利用Shader製作出不同的效果，所當用很多字形的話就等於在遊戲內放入大量的圖檔，加上個別材質求沒辦法統一batch，所以如果遊戲內用很多材質球的話，遊戲會有大量的draw call 這會過多的消耗遊戲效能。

簡單來說，就是已經處理的文字圖片，用呼叫的方式顯示在畫面上

好處：

• 可以對美術風格有大自由度，設計很複雜和吸睛；

• 沒有對齊(Alignment)問題 // 或者說美術同事已經處理

• 便利Batching (Rendering優化)

• 容易處理動畫

壞處：

• 不能動態變化，例如：對話框的內容

• 不能處理多語言（可以換圖來解決）

• 不方便修改字體/顏色

適合使用地方用處:

以SlotGame來講他適合用在沒有語言限制的地方，例如數字