Unity3D中UGUI不使用DOTween制作漸隱漸現效果

在做UI后期設計時，我們可能要對UI做一些特效，這篇文章我們來學習下如何在Unity3d中對實現漸隱漸現的效果，

首先我們看下Unity New UI即UGUI中漸隱漸現的做法.

觀察我們會發現Unity4.6 UI中每個能夠顯示控件都會有一個CanvasRender對象，CanvasRender有什么作用呢，我們

看下官方的解釋：The Canvas Renderer component renders a graphical UI object contained within a Canvas.簡單的

翻譯過來就是，畫布上的渲染器組件將呈現包含在一個畫布內的圖形用戶界面對象，再仔細查看CanvasRenderer類

時我們可以看到有兩個方法SetAlpha ，SetColor，顯然我們可以修改透明度Alpha和Color來實現漸隱漸現，同時我

們還可以發現Button，Text，Image等控件都會集成自Unity.UI.Graphic

 

如下所示：

public class Text : MaskableGraphic, ILayoutElement
 
public abstract class MaskableGraphic : Graphic, IMaskable
 
public class Image : MaskableGraphic, ICanvasRaycastFilter, ISerializationCallbackReceiver, ILayoutElement

 

然后我們再閱讀Graphic代碼，我們會發現有兩個方法

public void CrossFadeAlpha(float alpha, float duration, bool ignoreTimeScale);
public void CrossFadeColor(Color targetColor, float duration, bool ignoreTimeScale, bool useAlpha);

 

 

開源源碼如下：

public void CrossFadeAlpha(float alpha, float duration, bool ignoreTimeScale)
{
    CrossFadeColor(CreateColorFromAlpha(alpha), duration, ignoreTimeScale, true, false);
}
 
public void CrossFadeColor(Color targetColor, float duration, bool ignoreTimeScale, bool useAlpha)
{
    CrossFadeColor(targetColor, duration, ignoreTimeScale, useAlpha, true);
}
 
private void CrossFadeColor(Color targetColor, float duration, bool ignoreTimeScale, bool useAlpha, bool useRGB)
{
    if (canvasRenderer == null || (!useRGB && !useAlpha))
        return;
 
    Color currentColor = canvasRenderer.GetColor();
    if (currentColor.Equals(targetColor))
        return;
 
    ColorTween.ColorTweenMode mode = (useRGB && useAlpha ? ColorTween.ColorTweenMode.All : (useRGB ? ColorTween.ColorTweenMode.RGB : ColorTween.ColorTweenMode.Alpha));
 
    var colorTween = new ColorTween {duration = duration, startColor = canvasRenderer.GetColor(), targetColor = targetColor};
    colorTween.AddOnChangedCallback(canvasRenderer.SetColor);
    colorTween.ignoreTimeScale = ignoreTimeScale;
    colorTween.tweenMode = mode;
    m_ColorTweenRunner.StartTween(colorTween);
}        

 

 

因此我們利用CrossFadeColor或CrossFadeAlpha這兩個方法就可以實現漸隱漸現了

下面是客戶端調用代碼

{
 
    Component[] comps = GameObject.Find("/Canvas").GetComponentsInChildren<Component>();
    foreach (Component c in comps)
    {
        if (c is Graphic)
        {
            (c as Graphic).CrossFadeAlpha(0, 1, true);
        }
    }
}    

 

 

執行的效果就是所有Canvas下的元素都在1秒之類執行淡出效果！

---上面原文：Unity4.6 UI實現漸隱漸現（FadeIn FadeOut）效果---

以下是我在實際項目中結合協程制作的提示信息閃爍功能實現

　　internal Coroutine noticeCor;
    internal void ShowNotice()
    {
        HideNotice();
        noticeCor = StartCoroutine(NoticeShowScale());
    }

    internal void HideNotice()
    {
        if (null != noticeCor)
        {
            StopCoroutine(noticeCor);
            noticeItme.gameObject.SetActive(false);
        }
    }

    IEnumerator NoticeShowScale()
    {
        noticeItem.gameObject.SetActive(true);
        float targetA = 1;
        noticeItem.GetComponent<CanvasRenderer>().SetAlpha(0);
        float timer = 0;
        while (timer<6f)
        {
            noticeItem.GetComponent<Graphic>().CrossFadeAlpha(targetA, 1, true);
            yield return new WaitForSeconds(1f);
            timer += 1f;
            targetA = targetA == 0 ? 1 : 0;
        }
        noticeItem.gameObject.SetActive(false);
        noticeCor = null;
    }