Unity: 使用 DoTween 实现按钮淡入淡出效果

本教程介绍如何在 Unity 中使用 DoTween 库为按钮实现淡入淡出效果，并提供完整的代码示例。

你想要在游戏场景中使用一个按钮，并让它在被激活时以淡入淡出的方式显示吗？DoTween 库可以帮助你轻松实现这一效果。

代码示例

using UnityEngine;
using DG.Tweening;

public class Button : MonoBehaviour
{
    public string[] lines;

    private CanvasGroup canvasGroup;

    private void Awake()
    {
        canvasGroup = GetComponent<CanvasGroup>();
        canvasGroup.alpha = 0f;
        canvasGroup.interactable = false;
        canvasGroup.blocksRaycasts = false;
    }

    public void Dialogue()
    {
        Dialoguemanager.instance.ShowDialogue(lines);
    }

    public void FadeIn()
    {
        canvasGroup.DOFade(1f, 1f).OnComplete(() =>
        {
            canvasGroup.interactable = true;
            canvasGroup.blocksRaycasts = true;
        });
    }

    public void FadeOut()
    {
        canvasGroup.DOFade(0f, 1f).OnComplete(() =>
        {
            canvasGroup.interactable = false;
            canvasGroup.blocksRaycasts = false;
        });
    }
}

解释

导入 DoTween 库: 确保你已在项目中导入 DoTween 库。
添加 CanvasGroup 组件: 为你的按钮添加一个 CanvasGroup 组件，它用于控制按钮的透明度、交互性和射线阻塞。
初始化: 在 Awake() 方法中，将 canvasGroup 的 alpha 值设置为 0，并禁用交互和射线阻塞。
淡入: FadeIn() 方法使用 DOFade() 方法将 canvasGroup 的 alpha 值从 0 渐变到 1，并设置 OnComplete() 回调函数，在淡入完成后启用交互和射线阻塞。
淡出: FadeOut() 方法使用 DOFade() 方法将 canvasGroup 的 alpha 值从 1 渐变到 0，并设置 OnComplete() 回调函数，在淡出完成后禁用交互和射线阻塞。

使用

你可以通过调用 FadeIn() 和 FadeOut() 方法来实现按钮的淡入淡出效果。例如，在按钮被激活时调用 FadeIn() 方法，在按钮被禁用时调用 FadeOut() 方法。

总结

使用 DoTween 库可以轻松地为 Unity 游戏中的按钮实现淡入淡出效果，提升游戏界面视觉效果和用户体验。