Unity实现游戏里鼠标悬停在物体处显示UI提示（介绍名称等信息）的一种方法（可配置的xml文件形式）

Posted 2023-04-01 周周的Unity小屋

Unity实现鼠标悬停物体处显示UI提示

• • • 思路
    • 搭建demo场景和配置xml文件
    • 脚本实现
    • 效果演示

思路

这里主要是通过xml文件的形式保存物体的信息，再编写代码去解析这些个物体的信息，如xml中的一个节点MouseOver节点保存了一个物体的路径和物体的名称，那么解析的时候我们就可以通过GameObject.Find()方法找到这个物体，并给它添加鼠标事件，当鼠标悬停在物体处时，触发鼠标事件函数，就可以显示该物体的名称了，这里使用到了Unity中三个鼠标事件函数：OnMouseEnter()、OnMouseOver()和OnMouseExit()。

搭建demo场景和配置xml文件

添加一张Image作为底图，并添加一个Text文本作为子物体用来显示物体的信息的。Image初始时设置为隐藏，即在Inspector取消勾选；GameObject下存放三个物体，必须要添加碰撞体，可视物体情况选择添加不同的碰撞体，否则无法触发鼠标事件！

xml文件节点格式如下：

Path鼠标表示该物体在Hierarchy上的路径，InnerText表示该物体名称。

脚本实现

ModelEventListen脚本：

using UnityEngine;
using System;
public class ModelEventListen : MonoBehaviour

    //鼠标事件的委托
    public Action<GameObject> onEnter;
    public Action<GameObject> onOver;
    public Action<GameObject> onExit;
    /// <summary>
    /// 鼠标停留
    /// </summary>
    public void OnMouseOver()
    
        if (onOver!=null)
        
            onOver(gameObject);
        
    
    /// <summary>
    /// 鼠标停留
    /// </summary>
    public void OnMouseEnter()
    
        if (onEnter!=null)
        
            onEnter(gameObject);
        
    
    /// <summary>
    /// 鼠标移出
    /// </summary>
    public void OnMouseExit()
    
        if (onExit!=null)
        
            onExit(gameObject);
        
    
    /// <summary>
    /// Get方法，给物体添加鼠标监听的脚本
    /// </summary>
    /// <param name="obj"></param>
    /// <returns></returns>
    public static ModelEventListen Get(GameObject obj)
    
        if (obj == null) return null;
        ModelEventListen listener = obj.GetComponent<ModelEventListen>();
        if (listener==null)
        
            listener = obj.AddComponent<ModelEventListen>();
        
        return listener;
    

Panel_MouseOver脚本：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using System.Xml;
using UnityEngine.UI;
public class Panel_MouseOver : MonoBehaviour

    static Transform showImg;//显示的UI底图

    private void Start()
    
        showImg = transform.Find("Image");
        string filePath = "file://"+Application.dataPath + "/XML/MouseOver.xml";//xml文件路径
        StartCoroutine(LoadingXml(filePath));
    
    IEnumerator LoadingXml(string path)
    
        yield return null;
        using (WWW www=new WWW(path))
        
            yield return www;
            XmlDocument doc = new XmlDocument();
            doc.LoadXml(www.text);
            for (int i = 0; i < doc.FirstChild.ChildNodes.Count; i++)
            
                new MouseOver(doc.FirstChild.ChildNodes[i]);//遍历为每个节点的物体添加鼠标事件
            
        
    
    public class MouseOver
    
        private string showText;

        public MouseOver(XmlNode node)
        
            GameObject obj = GameObject.Find(node.Attributes["Path"].InnerText);
            if (obj != null)
            
                //为物体添加鼠标监听函数的脚本，并注册回调函数
                ModelEventListen.Get(obj).onEnter = OnEnter;
                ModelEventListen.Get(obj).onOver = OnOver;
                ModelEventListen.Get(obj).onExit = OnExit;
            
            showText = node.InnerText;
        
        //鼠标进入事件
        private void OnEnter(GameObject obj)
        
            //判断是否点击到UI上,点击到UI返回
            if (UnityEngine.EventSystems.EventSystem.current.IsPointerOverGameObject()) return;
            showImg.gameObject.SetActive(true);//显示UI提示框
            showImg.GetComponentInChildren<Text>().text = showText;//更新UI上显示的内容为当前物体的信息
        
        //鼠标悬停事件
        private void OnOver(GameObject obj)
        
            //更新UI的位置，并让它等于鼠标的位置加上一个Y轴上的偏移
            showImg.transform.position = Input.mousePosition+ new Vector3(0,100,0);
            showImg.GetComponentInChildren<Text>().text = showText;
        
        //鼠标移出事件
        private void OnExit(GameObject obj)
        
            showImg.gameObject.SetActive(false);
        
    

将该脚本挂载到Panel_MouseOver物体上。

效果演示

Unity学习实现screen space模式下UI跟踪游戏物体（在 UI 中跟踪和显示任何 Gameobject 位置）

话不多说，直接上代码：

using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;

[RequireComponent(typeof(CanvasGroup))]
public class UI_Tracking_Target_Pos : MonoBehaviour

	//目标物体
    public Transform target;
    //UI与目标物体的距离
    public Vector3 offset;
    //当物体不在视图范围内，显示的物体方向图片
    public Image targetOrientation;
    //要赋值给上面Image的上下左右sprite
    public Sprite up_Texture;
    public Sprite down_Texture;
    public Sprite left_Texture;
    public Sprite right_Texture;
	//目标物体的屏幕空间坐标
    private Vector3 targetScreenPos;

    // Update is called once per frame
    void Update()
    
        if (!isTargetInView())
        
            transform.GetComponent<CanvasGroup>().alpha = 0;
        
        else
        
            transform.GetComponent<CanvasGroup>().alpha = 1;
        

        targetScreenPos = Camera.main.WorldToScreenPoint(target.position);
        transform.GetComponent<RectTransform>().position = targetScreenPos + offset;
    

    private bool isTargetInView()
    
        Vector3 vec = Camera.main.WorldToViewportPoint(target.position);
        if (vec.x > 0 && vec.x < 1 && vec.y > 0 && vec.y < 1 && vec.z > 0)
        
            targetOrientation.transform.SetParent(transform);
            targetOrientation.transform.position = transform.position;
            targetOrientation.transform.GetComponent<CanvasGroup>().alpha = 0;
            //物体的中心的在相机内部
            return true;
        
        else
        
            targetOrientation.transform.SetParent(transform.parent);
            targetOrientation.transform.GetComponent<CanvasGroup>().alpha = 1;

            if (vec.x < 0)
            
                targetOrientation.sprite = left_Texture;
                targetOrientation.transform.GetComponent<RectTransform>().pivot = new Vector2(0, 0.5f);
                targetOrientation.transform.position = new Vector3(0, transform.position.y, 0);
            
            else if (vec.x > 1)
            
                targetOrientation.sprite = right_Texture;
                targetOrientation.transform.GetComponent<RectTransform>().pivot = new Vector2(1, 0.5f);
                //canvas scale设置为1920*1080
                targetOrientation.transform.position = new Vector3(1920, transform.position.y, 0);
            
            else if (vec.y < 0)
            
                targetOrientation.sprite = down_Texture;
                targetOrientation.transform.GetComponent<RectTransform>().pivot = new Vector2(0.5f, 0);
                targetOrientation.transform.position = new Vector3(transform.position.x, 0, 0);
            
            else if (vec.y > 1)
            
                targetOrientation.sprite = up_Texture;
                targetOrientation.transform.GetComponent<RectTransform>().pivot = new Vector2(0.5f, 1);
                targetOrientation.transform.position = new Vector3(transform.position.x, 1080, 0);
            
            return false;
        
    

Inspector面板配置如下：

效果如下：