「Unity3D」(5)CanvasGroup功能和Fade动画

CanvasGroup 对于UGUI来说，提供了十分重要的便利功能，并且能够受益于Unity实现的性能优化。从命名来看Group明显是针对“批量”操作的一个概念。对于复杂的UI界面，会有意想不到的效果和效率。

• Alpha 能够控制所有子节点UI元素的透明度。无论界面多么的复杂，只要是Graphic的子类，都能够被控制。这省去了针对各个元素，运行时的遍历，或是设计时的配置。

• Interactable 能够控制所有子节点UI元素的交互性。无论界面多么复杂，只要是Selectable的子类，都能够被控制。交互性就是Button控件不可用的灰色状态，如同取消了Button的Interactable属性。

• Blocks Raycasts 能够控制所有子节点UI元素事件触发。无论界面多么复杂，只要是Graphic的子类，都能够被控制。相当于取消了Graphic元素的Raycast Target属性。

• Ignore Parent Groups 控制当前元素可受到，父类CanvasGroup的属性影响。

当使用CanvasGroup控制的时候，我们会看到UI子元素的，Alpha，Interactable，RaycastTarget属性并没有改变。可见在UGUI源码里，是使用CanvasGroup的属性做了过滤操作，来实现控制效果的。

既然CanvasGroup可以控制整体界面的Alpha值，那么利用这个特性，来做Fade渐变动画，就在合适不过了。既可以使用协程也可以使用tween算法。比如，我就使用tween提供了UI界面的整体Fade功能。

/// <summary>/// Fade in GameObject all children Graphic./// </summary>public static void FadeInUI(this GameObject go, float duration, Action OnComplete = null){    var canvasGroup = go.GetComponent<CanvasGroup>();    if (canvasGroup == null)    {        canvasGroup = go.AddComponent<CanvasGroup>();    }    canvasGroup.ActionFadeIn(duration).Play();    if (OnComplete != null)    {        Tween.Create().AddIntervalCallback(duration, OnComplete).Play();    }}/// <summary>/// Fade out GameObject all children Graphic./// </summary>public static void FadeOutUI(this GameObject go, float duration, Action OnComplete = null){    var canvasGroup = go.GetComponent<CanvasGroup>();    if (canvasGroup == null)    {        canvasGroup = go.AddComponent<CanvasGroup>();    }    canvasGroup.ActionFadeOut(duration).Play();    if (OnComplete != null)    {        Tween.Create().AddIntervalCallback(duration, OnComplete).Play();    }}

不仅如此，是否可以使用CanvasGroup的Alpha = 0 且 Blocks Raycasts = false，来达到隐藏界面的目的，以此来代替Active false的操作。

---

「小组件大作用」