UGUI—Canvas Group及其常見應用場景

畫布組能夠集中控制畫布上的全部元素的某些方面，而無需單獨的處理每個元素。畫布組的屬性會影響到所在的遊戲對象以及全部子對象。

屬性：

alpha： 不透明度，介於0-1之間，0是全透明，1是不透明，UI元素會保留本身的alpha值，因此最後元素實際展現效果顯示的是alpha屬性是畫布組的alpha值 * 元素自己的alpha值。

interactable： 肯定此組件是否接收輸入。若是不勾選的話表明禁止交互(組件自身的交互功能)，值爲false。

Block Raycasts： 此組件是否做爲射線投射的碰撞體？須要在鏈接到畫布的圖形射線投射器上調用RayCast函數。若是不勾選的話表明不做爲射線投射的碰撞體，值爲false。

Ignore Parent Groups： 此組是否會受到遊戲對象層級視圖中更上層的Canvas Group組件的設置所影響。勾選則接收檢測，值爲true。

---

測試案例：

建立一個Canvas，添加Canvas Group組件。在這個Canvas下添加一個GameObject在GameObject中添加兩個顏色同樣的Button組件，而且第一個Button的alpha值設置爲146；

• 調節Canvas上的Canvas Group組件的alpha值，觀察到兩個Button的顏色變化爲：
  
• 設置Canvas上的Canvas Group組件的interactable爲不勾選狀態，觀察到兩個Button爲不可點擊狀態：
• 將GameObject的Ignore Parent Group勾選上，再改變Canvas上的Canvas Group組件的alpha值，以及將其interactable設置爲不勾選狀態，觀察到兩個Button的顏色和交互狀態不收影響：

---

CanvasGroup的Alpha與SetActive()方法比較：

• Canvas Group的Alpha與SetActive()二者之間的性能區別不大。
• Canvas Group的Alpha由0設置爲1時，並不會讓本身活着的子節點中腳本執行Awake()方法，而SetActive(true)則會執行Awake()方法。
• Canvas Group的Alpha設爲0和SetActive(false)的時候，一樣不會調用drawcall。

---

常見應用場景:

• 在窗口的GameObject上添加一個Canvas Group組件，經過控制它的Alpha值來淡入淡出整個窗口；
• 經過給父級GameObject上添加一個Canvas Group組件並設置它的Interactable值爲false來設置一套沒有交互(灰色)的控制；
• 經過將元素或元素的一個父級添加Canvas Group並設置BlockRaycasts值爲false來製做一個或多個不阻止鼠標事件的UI元素。

---

小案例(淡入淡出)

test腳本掛在案例的Canvas上面

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class test : MonoBehaviour
{
    private float alphaBegin = 0.0f;
    private float alphaSpeed = 2.0f;
    bool isShow = false;
    private CanvasGroup ex;
    // Start is called before the first frame update
    void Start()
    {
        ex = this.transform.GetComponent<CanvasGroup>();
    }

    // Update is called once per frame
    void Update()
    {
        if(!isShow)
        {
            ex.alpha = Mathf.Lerp(ex.alpha, alphaBegin, alphaSpeed * Time.deltaTime);
            if (Mathf.Abs(alphaBegin - ex.alpha)<= 0.01)
            {
                isShow = true;
                ex.alpha = alphaBegin;
                alphaBegin = 1;
            }
        }
        else
        {
            ex.alpha = Mathf.Lerp(ex.alpha, alphaBegin, alphaSpeed * Time.deltaTime * 0.5f);
            if(Mathf.Abs(alphaBegin - ex.alpha)<=0.01)
            {
                isShow = false;
                ex.alpha = alphaBegin;
                alphaBegin = 0;
            }
        }
    }
}
複製代碼

---

參考引用

# Unity中CanvasGroup組件