在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) {
// }
}
就酱,有其他疑问的评论区留言吧,尽我所能为大家解答。
总结
-
我们使用了
cc.tween()方法来创建一个 Tween 对象,并将其绑定到节点上。这个方法可以更简单地实现节点的移动,并且可以链式调用多个 Tween 操作。 -
我们使用了 by 方法来指定节点需要移动到的目标位置,并使用
start方法来开始 Tween 动作。
请注意,使用 cc.tween() 方法的好处在于它可以使代码更简洁和易读,并且可以链式调用多个 Tween 操作,以实现更复杂的动画效果。如果您对 Tween 动画不熟悉,建议您查看 Cocos Creator 文档中的 Tween 相关章节,以更好地理解其用法和原理。
更多推荐
所有评论(0)