首页 > 代码库 > uGUI练习(四) Draggable Object

uGUI练习(四) Draggable Object

一、步骤

监听UI的Drag事件,需要我们写一点点的代码。

1、创建一个Panel ,设置size为(100,100)

2、创建DraggableObjectScene.cs脚本

3、把脚本绑定在Panel上

image

4、脚本内容如下:

using UnityEngine;using System.Collections;using UnityEngine.UI;using UnityEngine.EventSystems;public class DraggableObjectScene : MonoBehaviour,IDragHandler,IPointerDownHandler,IPointerUpHandler{    //Drag事件,设置目标的位置为鼠标的位置    public void OnDrag(PointerEventData eventData)    {        GetComponent<RectTransform>().pivot.Set(0,0);        transform.position=Input.mousePosition;    }        public void OnPointerDown(PointerEventData eventData)    {        //缩小        transform.localScale=new Vector3(0.7f,0.7f,0.7f);    }    public void OnPointerUp(PointerEventData eventData)    {        //正常大小        transform.localScale=new Vector3(1f,1f,1f);    }}
<style type="text/css">.csharpcode, .csharpcode pre{ font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em;}.csharpcode .lnum { color: #606060; }</style>

Class DraggableObjectScene 继承了IDragHandler,IPointerDownHandler,IPointerUpHandler三个接口,从而可以接受到 OnDrag(PointerEventData eventData)  ,OnPointerDown(PointerEventData eventData)   ,OnPointerUp(PointerEventData eventData)  三个事件

二、事件系统

Namespace:UnityEngine.EventSystems

IDragHandler (MouseDrag)

Interface to implement if you wish to receive OnDrag callbacks.

IPointerDownHandler (MouseDown)

Interface to implement if you wish to receive OnPointerDown callbacks.

IPointerUpHandler (MouseUp)

Interface to implement if you wish to receive OnPointerUp callbacks.

三、Drag 效果

Drag UI

uGUI练习(四) Draggable Object