UGUI的目錄結(jié)構(gòu)

UGUI包括很多UI工具，但所有的UI工具都會在Canvas（畫布）下進行渲染顯示。所以當(dāng)新建一個工具時系統(tǒng)會默認新建一個Canvas（畫布）和一個EventSystem（事件系統(tǒng)），新建的UI工具會默認成為Canvas的子物體。當(dāng)場景中已經(jīng)存在一個Canvas時，新建的所有UI工具都會默認作為Canvas的子物體。如圖3-1所示：圖3-1

2.2 Canvas畫布

2.2.1創(chuàng)建Canvas畫布

在Hierarchy面板下進行操作Create-->UI。在右側(cè)會出現(xiàn)UGUI下的工具（如圖3-2）。點擊相應(yīng)工具該工具就會出現(xiàn)在Hierarchy面板以及場景視圖中。例如創(chuàng)建一個Canvas，在Hierarchy面板下操作Create--> UI --> Canvas，這樣在Hierarchy就會看到Canvas創(chuàng)建成功（如圖3-3）。

圖3-2

圖3-3

注：UGUI中創(chuàng)建任一個UI中的任何UI工具，在Hierarchy面板中系統(tǒng)都會默認添加Canvas并作為該UI工具的父物體。如果已經(jīng)有了Canvas則不在添加。如果新建多個UI工具，這些UI工具會自上而下排列在Canvas下，越是排在下面的在Sence視圖中越顯示在最上層。

創(chuàng)建完成后，在Hierarchy面板中系統(tǒng)默認會添加一個EventSystem。EventSystem作用是處理UI的事件，一般會結(jié)合代碼使用。

2.2.2 Canvas渲染模式

在Canvas里有一個Render Mode屬性。Render Mode用于控制Canvas及其子UI工具的渲染模式。Render Mode有三種渲染模式：Screen space – Overlay、Screen Space – Camera和World Space（如圖3-4 Canvas畫布渲染模式）。

Screenspace - Overlay

在場景中UI被渲染在屏幕上，因為根本沒有經(jīng)過投影空間，而是直接在屏幕空間繪制，所以在場景中沒有相機也會呈現(xiàn)UI。如果屏幕大小改變或更改了分辨率，畫布將自動更改大小來適配屏幕。

ScreenSpace - Camera

類似于Screen

Space - Overlay。但在這種渲染模式下，畫布被放置在指定相機前的一個給定的距離上，通過指定的相機UI被呈現(xiàn)出來，Camera setting會影響到UI的現(xiàn)實。如果屏幕大小改變或更改了分辨率，畫布將自動更改大小，以很好的適配屏幕。

World Space

在這種模式下呈現(xiàn)UI，UI是3D場景中的一個平面。與上面兩種不同，此時UI不需要面對鏡頭，可以面向任意方向?？梢允褂肦ect Transform設(shè)置畫布的大小，但其屏幕的大小將取決于相機拍攝的角度和相機的距離。

圖3-4 Canvas畫布渲染模式

2.2.3 Canvas Scaler

該屬性的作用就是對Canvas的縮放。

UIScale Mode包括ConstantPixelSize、ScaleWithScreenSize、ConstantPhysicalSize。如下圖：

ConstantPixelSize：

該模式下是由像素尺寸來決定UI縮放的。Scale

Factor默認為1，ConstantPixelSize的作用是設(shè)置scale的XYZ軸為1。所以，Canvas的width和height總是等于屏幕大小。當(dāng)設(shè)備分辨率變小時，scale的XYZ軸仍然為1，UI元素的大小并不改變，但Canvas的width和height變小了，所以UI元素在Canvas中的比例會等比例變化。

ScaleWithScreenSize：

該模式屏幕的尺寸來決定UI縮放。換言之UI會根據(jù)屏幕分辨率和當(dāng)前設(shè)備分辨率，自動匹配合適的scaleFactor。如果設(shè)備分辨率和參考分辨率比例不同，Canvas會自動設(shè)置width/height來解決。

ConstantPhysicalSize：

根據(jù)屏幕的PPI（像素密度）信息和ConstantPhysicalSize本身的配置信息得出一個最佳的scaleFactor，以達到UI在不同PPI設(shè)備上的最終大小都是一致的。