在cocos creator2.4中 点击节点完成移动

       控制台log输出为何频频失踪?
　　wxss代码为何频频失效?
　　wxml布局为何乱作一团?
　　究竟是道德的沦丧?还是人性的缺失?
　　让我们一起来 走 跑进科学

---

前言

入坑cocos了 坑爹的3.7不好使 一天下载了六个版本 最后稳定在2.4.11了，看到的小伙伴们记得互相转告，全是泪啊～～

---

正文

先上效果图

分解一下动作：

1、监听点击动作，点击后触发函数

2、函数中包含移动指令

3、移动指令中包括 移动到指定位置、根据给定角度完成旋转

ok上代码

const { ccclass, property } = cc._decorator;

@ccclass
export default class tapBottle extends cc.Component {

    //懂得都懂，这里是绑定的节点参数 用于监听事件
    @property(cc.Node)
    bottle: cc.Node = null;

    onLoad() {
        //这里是监听事件，监听到点击态去触发一个叫tap的函数
        this.bottle.on(cc.Node.EventType.TOUCH_START, this.tap, this)

    }
    //移动函数
    tap(event: cc.Event) {
        //tween的链式编程，括号内的参数格式为：移动时长 ，需要完成的动作
        //这个move表达的意思就是0.5s完成增量移动x100y100，by代表相对的增量移动，to代表绝对
        let move = cc.tween().by(0.5, { position: cc.v2(100, 100) })
        //这里我用的angle表示旋转 旧版可能是rotation
        let rotate = cc.tween().to(0.5, { angle: -70 })
        //最后用start来表示结尾，连起来就是增量移动100，100 到地方以后开始顺时针旋转70度
        cc.tween(this.bottle).then(move).then(rotate).start();

    }

    start() {

    }

    // update (dt) {
    // }
}

就酱，有其他疑问的评论区留言吧，尽我所能为大家解答。

---

 

总结

1. 我们使用了 cc.tween() 方法来创建一个 Tween 对象，并将其绑定到节点上。这个方法可以更简单地实现节点的移动，并且可以链式调用多个 Tween 操作。

2. 我们使用了 by 方法来指定节点需要移动到的目标位置，并使用 start 方法来开始 Tween 动作。

请注意，使用 cc.tween() 方法的好处在于它可以使代码更简洁和易读，并且可以链式调用多个 Tween 操作，以实现更复杂的动画效果。如果您对 Tween 动画不熟悉，建议您查看 Cocos Creator 文档中的 Tween 相关章节，以更好地理解其用法和原理。