zoukankan      html  css  js  c++  java
  • uGUI练习(五) Draggable Object

    练习目标

    学习制作一个可拖动的UI

    一、步骤

    监听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);
        }
    }
    

    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

  • 相关阅读:
    Linxu 挂载光盘和硬盘
    Linux firewall
    指纹获取 Fingerprint2
    Vue 封装的组件生命周期钩子
    vue富文本编辑,编辑自动预览,单个图片上传不能预览的问题解决:
    vue 集成百度富文本编辑器
    axios 的二次封装
    element 列表中已选的标记
    element 表单的input循环生成,并可单个input失去焦点单个验证并保存; (多个表单实例)
    axios 二进制流导出
  • 原文地址:https://www.cnblogs.com/zhaoqingqing/p/3972923.html
Copyright © 2011-2022 走看看