Unity UGUI的CanvasScaler（畫布縮放器）元件的介紹及使用

1. 什麼是CanvasScaler元件？

CanvasScaler是Unity中UGUI系統中的一個元件，用於控制畫布的縮放和適配。通過CanvasScaler元件，可以實現UI介面在不同解析度下的自適應顯示。

2. CanvasScaler的工作原理是什麼？

CanvasScaler元件通過調整畫布的縮放比例，使UI元素在不同解析度下保持一致的顯示效果。它根據設定的參考解析度和螢幕解析度的比例，計算出縮放比例，並將其應用到畫布上。

3. CanvasScaler的常用屬性有哪些？

• UI Scale Mode：設定畫布的縮放模式，有Constant Pixel Size（畫素大小不變）、Scale With Screen Size（根據螢幕大小縮放）和Constant Physical Size（物理大小不變）三種模式可選。
• Reference Resolution：設定參考解析度，用於計算縮放比例。
• Screen Match Mode：設定螢幕匹配模式，有Match Width Or Height（寬度或高度匹配）和Expand（擴充套件）兩種模式可選。
• Match：設定螢幕匹配模式為Match Width Or Height時，指定寬度或高度的匹配比例。
• Physical Unit：設定物理單位，用於計算Constant Physical Size模式下的縮放比例。

4. CanvasScaler的常用函數有哪些？

• SetScaleFactor(float scaleFactor)：設定畫布的縮放比例。
• SetReferencePixelsPerUnit(float referencePixelsPerUnit)：設定參考畫素單位。
• SetReferenceResolution(Vector2 referenceResolution)：設定參考解析度。
• SetScreenMatchMode(ScreenMatchMode screenMatchMode, float matchWidthOrHeight)：設定螢幕匹配模式和匹配比例。

5. CanvasScaler的使用範例程式碼：

範例1：設定畫布的縮放模式為Scale With Screen Size

CanvasScaler canvasScaler = GetComponent<CanvasScaler>();
canvasScaler.uiScaleMode = CanvasScaler.ScaleMode.ScaleWithScreenSize;
canvasScaler.referenceResolution = new Vector2(1920, 1080);
canvasScaler.screenMatchMode = CanvasScaler.ScreenMatchMode.MatchWidthOrHeight;
canvasScaler.matchWidthOrHeight = 0.5f;

操作步驟：

1. 獲取CanvasScaler元件。
2. 將uiScaleMode屬性設定為Scale With Screen Size。
3. 設定referenceResolution屬性為參考解析度，例如1920x1080。
4. 將screenMatchMode屬性設定為Match Width Or Height。
5. 設定matchWidthOrHeight屬性為匹配比例，例如0.5表示寬度和高度的匹配比例為1:2。

範例2：設定畫布的縮放模式為Constant Pixel Size

CanvasScaler canvasScaler = GetComponent<CanvasScaler>();
canvasScaler.uiScaleMode = CanvasScaler.ScaleMode.ConstantPixelSize;
canvasScaler.scaleFactor = 2f;

操作步驟：

1. 獲取CanvasScaler元件。
2. 將uiScaleMode屬性設定為Constant Pixel Size。
3. 設定scaleFactor屬性為縮放比例，例如2表示畫布放大兩倍。

範例3：設定畫布的縮放模式為Constant Physical Size

CanvasScaler canvasScaler = GetComponent<CanvasScaler>();
canvasScaler.uiScaleMode = CanvasScaler.ScaleMode.ConstantPhysicalSize;
canvasScaler.referencePixelsPerUnit = 100;

操作步驟：

1. 獲取CanvasScaler元件。
2. 將uiScaleMode屬性設定為Constant Physical Size。
3. 設定referencePixelsPerUnit屬性為參考畫素單位，例如100表示每個單位對應100個畫素。

範例4：動態設定畫布的縮放比例

CanvasScaler canvasScaler = GetComponent<CanvasScaler>();
canvasScaler.SetScaleFactor(1.5f);

操作步驟：

1. 獲取CanvasScaler元件。
2. 呼叫SetScaleFactor函數，設定畫布的縮放比例為1.5。

範例5：動態設定畫布的參考解析度

CanvasScaler canvasScaler = GetComponent<CanvasScaler>();
canvasScaler.SetReferenceResolution(new Vector2(1280, 720));

操作步驟：

1. 獲取CanvasScaler元件。
2. 呼叫SetReferenceResolution函數，設定畫布的參考解析度為1280x720。

注意事項：

• 在使用CanvasScaler元件時，需要將Canvas的Render Mode設定為Screen Space - Camera或Screen Space - Overlay，否則CanvasScaler將無效。
• 在設定參考解析度時，應根據目標平臺的解析度進行調整，以保證UI在不同裝置上的顯示效果一致。

參考資料：

• Unity官方檔案 - CanvasScaler