如何在canvas（统一）中的图像之间进行转换？

Question

所以我有 3 张相同的图像，但颜色不同，我想在我的菜单中循环显示它们。它们只是 hue/saturations 不同，我希望它们慢慢将 alpha 1 减 1，以便弹出后面的那个，然后重新开始循环。

我正在尝试设置 public 图像并降低它的 alpha，但它并不平滑。

using UnityEngine;
using System.Collections;
using UnityEngine.UI;


public class Fading : MonoBehaviour {

    public Image image;
    // Use this for initialization
    void Start () {

    }

    // Update is called once per frame
    void Update ()
    {
        //image.CrossFadeAlpha(50, 5, false);

        image.GetComponent<CanvasRenderer>().SetAlpha(0.1f);
        image.CrossFadeAlpha(10f, 4f, false);
    }
}

Answer 1

CrossFadeAlpha should only be called to start the image fade transition, via a button press or similar, as the method works similar to a Coroutine，示例（按下鼠标按钮）；

public class ImageFade : MonoBehaviour
{
    [SerializeField]
    private Image m_img;
    [SerializeField]
    private float m_fadeDuration;
    [SerializeField]
    private bool m_ignoreTimeScale;

    public void Update()
    {
        if (Input.GetMouseButtonDown(0))
            m_img.CrossFadeAlpha(0f, m_fadeDuration, m_ignoreTimeScale);
        if (Input.GetMouseButtonDown(1))
            m_img.CrossFadeAlpha(1f, m_fadeDuration, m_ignoreTimeScale);
    }
}

但是，如果您希望手动控制此功能，则必须采取更长的方法。下面您可以看到，每次按下鼠标时，淡入淡出乘数都会被取反，使其始终为 1 或 -1。然后将该值乘以该更新所需的时间分数（在添加到当前 alpha 值之前）；

Time.deltaTime / m_fadeDuration

除此之外，布尔值 m_requiresUpdate 确保避免不必要的更新，在淡入淡出完成后将其自身设置为 false。

public class ImageFade : MonoBehaviour
{
    [SerializeField]
    private Image   m_img;
    [SerializeField]
    private float   m_fadeDuration;
    [SerializeField]
    private bool    m_ignoreTimeScale;

    private int     m_fadeMultiplier;
    private float   m_alpha;
    private bool    m_requiresUpdate;

    public void Start()
    {
        m_fadeMultiplier    = 1;
        m_alpha             = 1f;
    }

    public void Update()
    {
        //Toggle subtracting/adding
        if (Input.GetMouseButtonDown(0))
        {
            m_fadeMultiplier = -m_fadeMultiplier;
            m_requiresUpdate = true;
        }

        //Update
        if (m_requiresUpdate)
        {
            //Fade
            m_alpha = Mathf.Clamp(m_alpha + (m_fadeMultiplier * (Time.deltaTime / m_fadeDuration)), 0f, 1f);
            m_img.canvasRenderer.SetAlpha(m_alpha);

            //Finished fading
            if (m_alpha == 0f || m_alpha == 1f)
                m_requiresUpdate = false;
        }
    }
}

希望这对您来说能很好地将所有内容联系在一起。

如何在canvas（统一）中的图像之间进行转换？

How to make transitions between images in canvas (unity)?

c#

unity3d

unity3d-2dtools

unity5