【Unity3D UGUI】事件接口(三) 按下移动、释放

【准备工作】

相关基础知识与注意事项烦请参见拙作——事件接口(零)总述

【接口介绍】

IDragHandler

该接口实现方法如下:

public void OnDrag(PointerEventData eventData)
{
    //当鼠标在A对象按下并拖拽时 A对象每帧响应一次此事件
    //注:如果不实现此接口,则后面的四个接口方法都不会触发
    Debug.Log("OnDrag " + name);
}

IInitializePotentialDragHandler

该接口实现方法如下:

public void OnInitializePotentialDrag(PointerEventData eventData)
{
    //当鼠标在A对象按下还没开始拖拽时 A对象响应此事件
    //注:此接口事件与IPointerDownHandler接口事件类似
    //    有兴趣的朋友可以测试下二者的执行顺序这里不再赘述
    Debug.Log("OnInitializePotentialDrag " + name);
}

IBeginDragHandler

该接口实现方法如下:

public void OnBeginDrag(PointerEventData eventData)
{
    //当鼠标在A对象按下并开始拖拽时 A对象响应此事件
    // 此事件在OnInitializePotentialDrag之后响应 OnDrag之前响应
    Debug.Log("OnBeginDrag " + name);
}

IEndDragHandler

该接口实现方法如下:

public void OnEndDrag(PointerEventData eventData)
{
    //当鼠标抬起时 A对象响应此事件
    Debug.Log("OnEndDrag " + name);
}

IDropHandler

该接口实现方法如下:

public void OnDrop(PointerEventData eventData)
{
    //A、B对象必须均实现IDropHandler接口,且A至少实现IDragHandler接口
    //当鼠标从A对象上开始拖拽,在B对象上抬起时 B对象响应此事件
    //此时name获取到的是B对象的name属性
    //eventData.pointerDrag表示发起拖拽的对象(GameObject)
    Debug.Log(eventData.pointerDrag.name + " OnDrop to " + name);
}

【Unity3D UGUI】事件接口(三) 按下移动、释放_第1张图片

【应用案例】

案例说明

本案例将实现从图片组中拖出图片到目标时,释放鼠标则目标变为拖入的图片。

具体实施

(1)创建五个 Image,其中三个命名为 Image Source 并指定不同的图片作为其“Source Image”属性,其余两个命名为 Image Target,不指定图片。五张图片看心情随便摆一摆;
(2)创建 DragImage 脚本,将其指定给所有 Image Source,并添加如下代码:

/*- - - - - - - - - - - - - - - - - - - - - - - - - -*/
/*    Script Editor: Eazey丶亦泽                      
/*    Blog   Adress: http://blog.csdn.net/eazey_wj     
/*    GitHub Adress: https://github.com/Eazey        
/*- - - - - - - - - - - - - - - - - - - - - - - - - -*/

/*   Either none appetency, or determined to win.    */

/* * * * * * * * * * * * * * * * * * * * * * * * * * */
/* Script Overview: 
 * The script target is that realize effect of drag 
 * image.
/* * * * * * * * * * * * * * * * * * * * * * * * * * */

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

public class DragImage : MonoBehaviour,
    IDragHandler,IBeginDragHandler,IEndDragHandler
    {

    private Image image;
    private GameObject go;

    void OnEnable()
    {
        image = GetComponent();
    }

    public void OnBeginDrag(PointerEventData eventData)
    {
        if (image.sprite == null)
        {
            Debug.LogError("Current component of 'Image' have none 'Sprite'.");
            return;
        }

        go = new GameObject("Draging");
        go.transform.SetParent(eventData.pointerDrag.transform.parent);

        go.transform.localPosition = Vector3.zero;
        go.transform.localScale = Vector3.one;

        Image goImg = go.AddComponent();
        goImg.sprite = image.sprite;
        goImg.raycastTarget = false;
    }

    public void OnDrag(PointerEventData eventData)
    {
        if (go == null)
            return;

        go.transform.position = Input.mousePosition;
    }

    public void OnEndDrag(PointerEventData eventData)
    {
        Destroy(go);
        go = null;
    }
}

(3)创建 DropImage 脚本,将其指定给所有的 Image Target,并添加如下代码:

/*- - - - - - - - - - - - - - - - - - - - - - - - - -*/
/*    Script Editor: Eazey丶亦泽                      
/*    Blog   Adress: http://blog.csdn.net/eazey_wj     
/*    GitHub Adress: https://github.com/Eazey        
/*- - - - - - - - - - - - - - - - - - - - - - - - - -*/

/*   Either none appetency, or determined to win.    */

/* * * * * * * * * * * * * * * * * * * * * * * * * * */
/* Script Overview: 
 * The script target is change the image after it had 
 * dropped.
/* * * * * * * * * * * * * * * * * * * * * * * * * * */

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

public class DropImage : MonoBehaviour,IDropHandler {

    private Image image;

    void OnEnable()
    {
        image = GetComponent();
        if (image == null)
            image = gameObject.AddComponent();
    }

    public void OnDrop(PointerEventData eventData)
    {
        Sprite s = GetSprite(eventData);
        if (s != null)
            image.sprite = s;
    }

    private Sprite GetSprite(PointerEventData eventData)
    {
        GameObject goSource = eventData.pointerDrag;
        if (goSource == null)
            return null;

        Image imgSource = eventData.pointerDrag.GetComponent();
        if (imgSource == null)
            return null;

        DragImage DragSource = imgSource.GetComponent();
        if (DragSource == null)
            return null;

        return imgSource.sprite;
    }
}

(4)最终效果如下图所示:
【Unity3D UGUI】事件接口(三) 按下移动、释放_第2张图片

你可能感兴趣的:(Unity3D,UGUI)