Unity学习篇之UGUI事件监听接口

平时做项目的时候，如果项目中有UGUI，一般会用到button的监听事件，点击按钮即可调用指定的方法，但是对于其他的UI控件如Image就没有那么方便了，今天我就介绍一种Unity自带的UGUI事件监听的方法，需要用到一些接口。

前期准备：创建一个Image控件，将Listener.cs脚本挂载上去即可。

1.点击事件监听接口 【IPointerDownHandler、IPointerUpHandler】

IPointerDownHandler是用于监听指针按下的接口，IPointerUpHandler是用于监听指针弹起的接口，Listener类继承这两个接口之后必须要实现接口对应的方法，并在事件触发时调用该方法。如下：

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

public class Listener : MonoBehaviour, IPointerDownHandler, IPointerUpHandler
{
    public Text reminder;
    public Image image;
    public void OnPointerDown(PointerEventData eventData)
    {
        reminder.text = "点击：" + eventData.ToString();
        image.color = new Color(160 / 255.0f, 255 / 255.0f, 160 / 255.0f);
        Debug.Log("OnPointerDown(点击)");
    }

    public void OnPointerUp(PointerEventData eventData)
    {
        reminder.text = "抬起：" + eventData;
        image.color = new Color(255 / 255.0f, 160 / 255.0f, 160 / 255.0f);
        Debug.Log("OnPointerUp(抬起)");
    }
}

 

2.滑动事件监听接口 【IBeginDragHandler、IDragHandler、IEndDragHandler】

IBeginDragHandler是用于监听指针按下之后开始滑动的接口，IDragHandler是用于监听指针滑动时的接口，IEndDragHandler是用于监听指针停止滑动的接口。如下：

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

public class Listener : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler
{
    public Text reminder;

    public void OnBeginDrag(PointerEventData eventData)
    {
        reminder.text = "开始滑动：" + eventData;
        Debug.Log("OnBeginDrag(开始滑动)" );
    }

    public void OnDrag(PointerEventData eventData)
    {
        reminder.text = "滑动中：" + eventData;
        Debug.Log("OnDrag(滑动中)" );
    }

    public void OnEndDrag(PointerEventData eventData)
    {
        reminder.text = "结束滑动：" + eventData;
        Debug.Log("OnEndDrag(结束滑动)");
    }
}

 

3.进入检测事件监听接口 【IPointerEnterHandler、IPointerExitHandler】

IPointerEnterHandler是用于监听指针移动到UI控件内的接口，IPointerExitHandler是用于监听指针移动到UI控件外的接口。如下：

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

public class Listener : MonoBehaviour, IPointerEnterHandler, IPointerExitHandler
{
    public Text reminder;

    public void OnPointerEnter(PointerEventData eventData)
    {
        reminder.text = "进入：" + eventData;
        Debug.Log("OnPointerEnter(进入)");
    }

    public void OnPointerExit(PointerEventData eventData)
    {
        reminder.text = "离开：" + eventData;
        Debug.Log("OnPointerExit(离开)");
    }
}

4.完整点击事件监听接口 【IPointerClickHandler】

IPointerClickHandler是用于监听指针在物体上完成一次点击的接口，这里需要注意的是，指针在物体上按下再抬起才会调用该接口方法，如果只是按下然后移动出去再抬起是不会调用该方法。如下：

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

public class Listener : MonoBehaviour, IPointerClickHandler
{
    public Text reminder;
    public Image image;

    public void OnPointerClick(PointerEventData eventData)
    {
        reminder.text = "物体" + name + "被拾取";
        Debug.Log("OnPointerClick");
    }
}

5.实例：虚拟摇杆制作

简单介绍了几种监听事件的接口，下面我们来练习一下，使用监听事件+Image控件来制作虚拟摇杆。

虚拟摇杆素材（仅供学习，请勿商业）：

代码如下：

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

public class Listener : MonoBehaviour, IPointerDownHandler, IPointerUpHandler, IDragHandler
{
    //虚拟滑杆
    public Image touchArea;
    public Image dirBgImg;
    public Image dirPointImg;
    public Text reminder1;
    public Text reminder2;

    public Vector2 defaultDirBgPos = Vector2.zero;//虚拟摇杆默认位置
    public Vector2 dir = Vector2.zero;//虚拟摇杆方向向量
    public Vector2 startPos = Vector2.zero;//虚拟摇杆开始位置
    public float pointDis = 110;//虚拟摇杆最大的位移
    
    public void Awake()
    {
        defaultDirBgPos = dirBgImg.transform.position;
        reminder1.text = "虚拟摇杆底座位置：" + dirBgImg.transform.position;
        reminder2.text = "虚拟摇杆位置：" + dirPointImg.transform.position;
    }

    public void OnPointerDown(PointerEventData eventData)
    {
        dirBgImg.transform.position = eventData.position;
        startPos = dirBgImg.transform.position;
        reminder1.text = "虚拟摇杆底座位置：" + dirBgImg.transform.position;
    }

    public void OnPointerUp(PointerEventData eventData)
    {
        dirBgImg.transform.position = defaultDirBgPos;
        dirPointImg.transform.localPosition = Vector2.zero;
    }

    public void OnDrag(PointerEventData eventData)
    {

        dir = eventData.position - startPos;
        if (dir.magnitude > pointDis)
        {
            Vector2 clampDir = Vector2.ClampMagnitude(dir, pointDis);
            dirPointImg.transform.position = startPos + clampDir;
        }
        else
        {
            dirPointImg.transform.position = eventData.position;
        }
        reminder2.text = "虚拟摇杆位置：" + dirPointImg.transform.position;
    }
}

 

更多API请查阅 https://docs.unity3d.com/ScriptReference/EventSystems.IDragHandler.html