专栏首页AnRFDevCocos Creator 拖动效果

Cocos Creator 拖动效果

我们要实现的效果是,按住并拖动一个小物体,物体跟随手指(鼠标)移动。

代码DragToAnywhere.ts

@ccclass
export default class DragToAnywhere extends cc.Component {

    @property(cc.Label)
    label: cc.Label = null;

    start () {
        
    }

    onEnable() {
        this.node.on(cc.Node.EventType.TOUCH_MOVE, this._onTouchMove, this);
        this.node.on(cc.Node.EventType.TOUCH_END, this._onTouchEnd, this);
    }

    onDisable() {
        this.node.off(cc.Node.EventType.TOUCH_MOVE, this._onTouchMove, this);
        this.node.off(cc.Node.EventType.TOUCH_END, this._onTouchEnd, this);
    }

    // update (dt) {}

    _onTouchMove(touchEvent) {
        let location = touchEvent.getLocation();
        this.node.position = this.node.parent.convertToNodeSpaceAR(location); // 确定位置
    }

    _onTouchEnd(touchEvent) {
        // 放下
    }
}

DragToAnywhere.ts挂在预制体上。在场景中创建预制体对象。

let node1 = cc.instantiate(this.drag_item);
this.node.addChild(node1);
node1.x = 100;
node1.y = 100;
node1.getComponent(DragToAnywhere).label.string = '水星';

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 2D / 3D 往期精选!附送 github 地址!Cocos Creator !

    https://github.com/baiyuwubing/cocos-creator-examples/tree/master/aimLine

    白玉无冰
  • Cocos技术派|3D小游戏《快上车》技术分享

    7月初,Cocos Creator 3D 发布了第一个公测版本,超过千名开发者报名参与公测。为了高效收集测试反馈,集中精力进行产品的迭代和优化,快速推动产品达到...

    一枚小工
  • 推荐几个实用Cocos Creator插件!看过的都说好

    2021年过半,Cocos Store 上目前已超过 400+ 资源,出现了有不少实用而有趣的插件工具,推荐几个给大家把玩,希望本文能对大家的工作有所帮助或启发...

    张晓衡
  • 如何抄一个 Shader 到 Cocos Creator

    感谢大家的观看,感谢大家的点赞留言分享支持,感谢3D折纸效果的实现(视频+文字)中老板们的赞赏支持,非常感谢。

    白玉无冰
  • Cocos 引擎 UI 全新升级:进一步提升编辑器体验

    Cocos Creator 3D 全面公测已有一段时间,距离正式发布已经不远了。为了迎接即将发布的 Cocos Creator 3D,我们对 Cocos Cre...

    张晓衡
  • Cocos Creator 国旗头像生成器,源码奉上!

    要获取手机相册图片,需要使用浏览器 input 标签提供的能力,在桌面浏览器上则是浏览文件目录选择图片。

    张晓衡
  • Cocos Creator 3.0 教程! 标志板! Billboard !

    标志板可以以低廉的成本呈现出还不错的效果,例如场景中大量出现的草(一种植物)、树和金币等。

    白玉无冰
  • 笑容逐渐消失? shader 编程入门实战 ! Cocos Creator!

    在 Cocos Creator 编辑器中,新建一个材质 Material,Effect 选择为 gradient,拖入两张图片。

    白玉无冰
  • Cocos Creator基础教程—AudioSource组件(6)

    这篇教程我们介绍cc.AudioSource音频播放组件的使用,使用cc.AudioSource组件不用写任何一行代码,就能控制音效的音量、播放、停止、恢复等操...

    张晓衡
  • 用 Cocos Creator 制作平台跳跃游戏

    平台跳跃类游戏如《超级马里奥》《Celeste蔚蓝》等,非常考验玩家的操作和判断,有着非常本真的游戏乐趣。这类游戏乍一看,挺容易做的,但是要做好却不太容易。今天...

    一枚小工
  • 写一个在线位图字体制作工具!BitmapFont!

    https://www.bilibili.com/video/BV1cf4y1H7Pa

    白玉无冰
  • 奎特尔星球导航

    有朋友在公众号留言,提出「奎特尔星球」上的文章对于初学者路径不清晰,不知道按怎么的顺序阅读。

    张晓衡
  • 3D 小游戏《飞跃地平线 Plus》开发分享

    近日,ID“woskymi”的开发者在 Cocos 社区分享了他采用 Cocos Creator 2.1.2 制作的 3D 小游戏《飞跃地平线 Plus》引发论...

    张晓衡
  • 最新Shader组件已经上传Github,再盘点一下Creator星球上的几大开源工具包

    晓衡开始写公众号,最早是从上架 Cocos 商店的 pbkiller 插件开始的,到今天有2年了。在这期间,又陆续在公众号上分享了多个实用工具包,在这里统一盘点...

    张晓衡
  • 如何在 Creator3D 中切换模型贴图,超级简单

    前两天有伙伴在 QQ 上询问,如何在 Creator 3D 中切换模型贴图。Shawn 之前也没尝试过,不过根据之前 Cocos Creator 的经验以及这几...

    张晓衡
  • JS基础 | Cocos Creator 开发环境搭建

    编程并不只是简单地写代码,而是要将编写的代码运行在指定平台环境上,在此之前我们还需要搭建生产代码的环境。

    张晓衡
  • Cocos开发者社区趣闻播报

    第一眼看到游戏视频就被深深的震撼了,3D一直是Shawn未敢尝试的领域,2D都没搞清楚怕3D只会更打击人...不过看到这个游戏视频,而且还是以Cocos为基础开...

    张晓衡
  • 从0开始实现一个合成大西瓜

    作者:橙红年代 (https://juejin.cn/post/6923803717808422925)

    落落落洛克
  • 大神驾到|「大掌教」带你上车Cocos3D!

    大掌教,从事游戏开发多年,精通 Cocos/Unity 等游戏引擎,精通安卓/iOS/H5等多种平台开发,发表过多个开源项目和 100 多篇原创博文,经验丰富,...

    张晓衡

扫码关注云+社区

领取腾讯云代金券