Unity技巧:轻松实现鼠标悬停文本时的动态变色效果

文章目录


前言

在游戏或应用中,给用户的界面添加一些小的互动效果能让它们更加吸引人。比如,当策划要求你这样做的时候 ,当用户将鼠标悬停在文字上时,文字颜色改变,这样的效果会让界面看起来更有趣。本文将教你如何在Unity中实现这个效果,将写好的脚本挂载到按钮上即可。


一、Text

csharp 复制代码
using UnityEngine;
using UnityEngine.UI;
using UnityEngine.EventSystems;

public class TextColorChange : MonoBehaviour, IPointerEnterHandler, IPointerExitHandler
{
    public Color normalColor = Color.blue; // 默认颜色
    public Color hoverColor = Color.white; // 悬停时颜色

    private Text textComponent;

    private void Start()
    {
        textComponent = GetComponentInChildren<Text>();
        if (textComponent == null)
        {
            Debug.LogError("没有找到Text组件,请确保文本对象是Button的子对象,并且拥有Text组件。");
        }
        else
        {
            textComponent.color = normalColor;
        }
    }

    public void OnPointerEnter(PointerEventData eventData)
    {
        if (textComponent != null)
        {
            textComponent.color = hoverColor; // 悬浮时将字体颜色改为悬停颜色
        }
    }

    public void OnPointerExit(PointerEventData eventData)
    {
        if (textComponent != null)
        {
            textComponent.color = normalColor; // 离开时将字体颜色还原为默认颜色
        }
    }
}

二、TMP_Text

csharp 复制代码
using UnityEngine;
using TMPro;
using UnityEngine.EventSystems;

public class TMPTextColorChange : MonoBehaviour, IPointerEnterHandler, IPointerExitHandler
{
    public Color normalColor = Color.blue; // 默认颜色
    public Color hoverColor = Color.white; // 悬停时颜色

    private TMP_Text textMeshPro;

    private void Start()
    {
        textMeshPro = GetComponentInChildren<TMP_Text>();
        if (textMeshPro == null)
        {
            Debug.LogError("没有找到TMP_Text组件,请确保文本对象是Button的子对象,并且拥有TMP_Text组件。");
        }
        else
        {
            textMeshPro.color = normalColor;
        }
    }

    public void OnPointerEnter(PointerEventData eventData)
    {
        if (textMeshPro != null)
        {
            textMeshPro.color = hoverColor; // 悬浮时将字体颜色改为悬停颜色
        }
    }

    public void OnPointerExit(PointerEventData eventData)
    {
        if (textMeshPro != null)
        {
            textMeshPro.color = normalColor; // 离开时将字体颜色还原为默认颜色
        }
    }
}

二、颜色转换

如果要使用配置加载,或者用类似#xxxxx的颜色格式进行配置的话,使用以下逻辑封装成适合的方法。

csharp 复制代码
Color sample;
ColorUtility.TryParseHtmlString("#3790E7", out sample);
textMeshPro.color = sample;

Text.color = ColorUtility.TryParseHtmlString("#3790E7", out var color) ? color : Color.blue;

总结

使用这些脚本,你可以轻松地在Unity中实现鼠标悬停时改变文字颜色的效果。

相关推荐
EQ-雪梨蛋花汤4 小时前
【Part 3 Unity VR眼镜端播放器开发与优化】第四节|高分辨率VR全景视频播放性能优化
unity·音视频·vr
与火星的孩子对话8 小时前
Unity进阶课程【六】Android、ios、Pad 终端设备打包局域网IP调试、USB调试、性能检测、控制台打印日志等、C#
android·unity·ios·c#·ip
幻世界10 小时前
【Unity智能模型系列】Unity + MediaPipe + Sentis + ArcFace模型:构建高效人脸识别比对系统
unity·游戏引擎
漫游者Nova17 小时前
虚幻引擎Unreal Engine5恐怖游戏设计制作教程,从入门到精通从零开始完整项目开发实战详细讲解中英字幕
ue5·游戏引擎·虚幻·游戏开发完整教程·恐怖游戏开发
死也不注释1 天前
【Unity 编辑器工具开发:GUILayout 与 EditorGUILayout 对比分析】
unity·编辑器·游戏引擎
小赖同学啊1 天前
物联网中的Unity/Unreal引擎集成:数字孪生与可视化控制
物联网·unity·游戏引擎
Zlzxzw2 天前
使用unity创建项目,进行动画制作
unity·游戏引擎
X_StarX2 天前
【Unity笔记01】基于单例模式的简单UI框架
笔记·ui·unity·单例模式·游戏引擎·游戏开发·大学生
九班长2 天前
Golang服务端处理Unity 3D游戏地图与碰撞的详细实现
3d·unity·golang
ysn111112 天前
NGUI实现反向定位到层级面板结点
unity