cocos creator3.7版本拖拽事件处理

news2024/11/19 18:30:21

前言:网上能找到的资料都太落后了,导致哥们用AI去写,全是瞎B写,版本都不对。贴点实际有用的。别老捣鼓你那破convertToNodeSpaceAR或者convertToNodeSpace了。

核心代码

touch.getDeltaX()
touch.getDeltaY()
在这里插入图片描述

在cocoscreator3.7版本中通过这个方法,修改节点坐标就可以了。

import { _decorator, Button, Component, EventTouch, Node, systemEvent, UITransform, Vec2, Vec3 } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('LockManager')
export class LockManager extends Component {
    @property(Node)
    public dragNode: Node = null; // 假设这是您想要拖拽的 Sprite 所在的节点

    @property(Node)
    public transformNode: Node = null; // 假设这是您想要移动的node节点

    private _isDragging = false;

    start() {
        if (this.dragNode) {
            this.dragNode.on(Node.EventType.TOUCH_START, this.onTouchStart, this);
            this.dragNode.on(Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
            this.dragNode.on(Node.EventType.TOUCH_END, this.onTouchEnd, this);
            this.dragNode.on(Node.EventType.TOUCH_CANCEL, this.onTouchCancel, this);
        }
    }

    onTouchStart(touch: EventTouch) {
        this._isDragging = true;
    }

    onTouchMove(touch: EventTouch) {
        if (!this._isDragging) return;
        // 更新节点的y坐标
        const originPos = this.transformNode.getPosition()
        originPos.y += touch.getDeltaY();
        this.transformNode.setPosition(originPos)
    }

    onTouchEnd(touch: EventTouch) {
        this._isDragging = false;
        // 可以在这里添加拖拽结束后的逻辑
    }

    onTouchCancel(touch: EventTouch) {
        this._isDragging = false;
        // 可以在这里添加触摸被取消的逻辑
    }

    onDestroy() {
        if (this.dragNode) {
            this.dragNode.off(Node.EventType.TOUCH_START, this.onTouchStart, this);
            this.dragNode.off(Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
            this.dragNode.off(Node.EventType.TOUCH_END, this.onTouchEnd, this);
            this.dragNode.off(Node.EventType.TOUCH_CANCEL, this.onTouchCancel, this);
        }
    }
}



本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1811513.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

windows系统下安装fnm

由于最近做项目要切换多个node版本,查询了一下常用的有nvm和fnm这两种,对比了一下选择了fnm。 下载fnm 有两种方式,目前最新版本是1.37.0: 1.windows下打开powershell,执行以下命令下载fnm winget install Schniz.f…

Linux上手实验七:网络配置与管理

lab 2.3 网络配置与管理 1、实验背景: 做为服务器操作系统的企业版 CentOS 7 的网络性能及网络管理是非常重要,往往在部署重要应用的先决条件就是,配置好网络参数及测试好网络的联通性。 作为 Linux 管理员,对于系统的网络配置和…

PNAS | 工作记忆中大脑节律的因果功能图

摘要 工作记忆是一个涉及大脑中多个功能解剖节点的关键认知过程。尽管有大量与工作记忆结构相关的神经影像学证据,但我们对控制整体表现的关键中枢的理解并不完整。因果解释需要在对特定功能解剖节点进行安全、暂时和可控的神经调节后进行认知测试。随着经颅交流电…

velocity:允许赋值语句赋值null:#set( $var = ...)

velocity的模板中赋值语句#set( $var ....)默认是不允许对变量设置为null的。 参见velocity官方文档说明:https://velocity.apache.org/engine/devel/vtl-reference.html#set-establishes-the-value-of-a-reference 因为不能赋值null,在循环语句中&…

uni-app加持下的Vue开发:效率与功能的双赢

文章目录 一、Vue.js简介二、uni-app简介三、Vue与uni-app混合开发的优势四、Vue与uni-app混合开发的实践《Vue.js核心技术解析与uni-app跨平台实战开发》编辑推荐内容简介作者简介目录前言/序言 在当今的前端开发领域,Vue.js以其简洁的API、灵活的组件系统和响应式…

小白学Linux | 日志排查

一、windows日志分析 在【运行】对话框中输入【eventvwr】命令,打开【事件查看器】窗 口,查看相关的日志 管理员权限进入PowerShell 使用Get-EventLog Security -InstanceId 4625命令,可获取安全性日志下事 件 ID 为 4625(失败登…

一分钟使用Java实现socket消息传递

一、目的 本程序旨在模拟航空器与塔台之间的实时消息传递,展示其在实际航空通讯中的应用。通过使用 Java 的 JFrame 进行图形用户界面(GUI)的设计,以及 socket 编程实现网络通信,该程序能够提供一个直观的界面来显示航…

Java(蓝桥杯)一维二维数组应用

介绍: 一维数组,用来熟悉代码,主要考察二维数组: 二维数组存储行、列数据,遍历,输出结果 二维数组的旋转 二维数组数据的找规律。等等 二维数组问题,不难,但是比较繁琐。需要细…

java程序在运行过程各个内部结构的作用

一:内部结构 一个进程对应一个jvm实例,一个运行时数据区,又包含多个线程,这些线程共享了方法区和堆,每个线程包含了程序计数器、本地方法栈和虚拟机栈接下来我们通过一个示意图介绍一下这个空间。 如图所示,当一个hell…

在Linux中进行Redis的yum安装与配置

redis安装在IP为x.x.x.x的服务器上 redis是使用内存作为主存,使用硬盘来实现数据持久化,而且redis是周期性的将数据写到硬盘上。这就意味着一旦服务器出现断电、重启之类的情况,很可能会出现数据丢失的情况,因此不建议使用redis来…

直播美颜插件详解:美颜SDK技术探讨

今天,小编将深入讲解美颜插件与美颜SDK技术,对其原理和应用进行详细解析。 一、美颜SDK技术简介 美颜SDK专门用于实现美颜功能。其核心技术包括图像处理算法和人工智能技术。美颜SDK可以实时捕捉摄像头画面,识别人脸,然后对人脸…

【附带源码】机械臂MoveIt2极简教程(三)、URDF/SRDF介绍

系列文章目录 【附带源码】机械臂MoveIt2极简教程(一)、moveit2安装 【附带源码】机械臂MoveIt2极简教程(二)、move_group交互 【附带源码】机械臂MoveIt2极简教程(三)、URDF/SRDF介绍 目录 系列文章目录1. URDF1.1 URDF相关资源1.2 小技巧1.2.1 关节名称1.2.2 安全限制…

云计算-期末复习题-选择/判断/填空/简答(1)

目录 填空题/简答题 单选题 多选题 判断题 云计算期末复习部分练习题,下一章会补全。祝大家好好复习,顺利通过课程。 填空题/简答题 >保障云基本安全的对策包括()、()和() &…

[AI Omost] 革命性AI图像合成技术,让你的创意几乎一触即发!

介绍 Omost 是一个创新的项目,它利用大型语言模型(LLM)的编码能力来生成图像,特别是通过图像合成技术。项目的名称“Omost”发音类似于“almost”,寓意着使用该项目后,用户的图像生成工作几乎可以完成。同…

超详解——python函数定义和调用——小白篇

目录 1. 函数的参数 位置参数: 关键字参数: 默认参数: 2. 关键字参数 3. 参数组 4. 函数重载 5. 函数的返回值 单个返回值: 多个返回值: 6. 函数的内置属性 __name__: __doc__: 7…

重温react-02

shopdemo import React, { Component } from react export default class shopDemo extends Component {state {goods: [{id: 1,name: 商品1,price: 100,number: 0,money: 0},{id: 2,name: 商品2,price: 200,number: 0,money: 0},{id: 3,name: 商品3,price: 300,number: 0,mo…

如何解决 Git 默认不区分文件名大小写和同名文件共存?

修改文件命名的大小写,不会有 git 记录 本文章的例子:将 demo.vue 文件命名改为 Demo.vue 1、在Git项目路径下执行该命令 git config core.ignorecase false (1)以上方法可以实现 git 区分 demo.vue 与 Demo.vue 文件&#xff0…

【投稿优惠|权威主办】2024年物联网、土木建筑与城市工程国际学术会议(ICITCEUE 2024)

2024年物联网、土木建筑与城市工程国际学术会议(ICITCEUE 2024) 2024 International Academic Conference on the Internet of Things, Civil Engineering and Urban Engineering(ICITCEUE 2024) ▶会议简介 2024年物联网、土木建…

【解读】核密度图

def:what 核密度估计(Kernel Density Estimation,简称KDE)是一种用来估计随机变量概率密度函数的非参数方法 实现:(库函数)how import seaborn as sns import matplotlib.pyplot as plt# 使用…

开源完全自动化的桌上足球机器人Foosbar;自动编写和修复代码的AI小工具;开源工具,可本地运行,作为Perplexity AI的替代方案

✨ 1: Foosbar Foosbar是一款完全自动化的桌上足球机器人,能与人类玩家对战,具备防守、传球和射门能力。 Foosbar是一个完全自动化的桌上足球机器人,它实现了一侧由机器人控制,另一侧由人类玩家对战的游戏模式。这个机器人能够自…