本文主要简绍cc.tween与sequence、delay、parallel、repeat和call的各种搭配、混合使用,实现事件序列的串并行控制
1. 简单串行
1 2 3 4 5 6 7 8 | // 示例代码,先执行动作1、再执行动作2、然后执行回调 cc.tween(node) .to(time1, { position: newPosition }) // 动作1 .to(time2, { angle: newAngle }) // 动作2 .call(() => { // console.log('>> cc.tween end') }) .start(); |
2. 并行parallel、延迟delay
1 2 3 4 5 6 7 8 9 | // 示例代码,先同步执行动作1和动作2、然后延迟0.5秒、然后执行动作3 cc.tween(node) .parallel( cc.tween().to(time1, { position: newPosition1 }),// 动作1 cc.tween().to(time2, { angle: newAngle }),// 动作2 ) .delay(0.5) .to(time2, { position: newPosition2 }) // 动作3 .start(); |
3. 并行parallel、串行sequence、重复repeat
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | // 示例代码 串并行混排、重复 cc.tween(node) .repeat(3, // 让整个 sequence 重复 3 次 cc.tween().sequence( //先执行第一个parallel,然后等待0.5秒、然后执行第二个parallel cc.tween().parallel( //先动作1与动作2串行 cc.tween().to(1, { position: cc.v2(200, 200) }), // 动作1 cc.tween().to(1, { angle: 180 }) //动作2 ), cc.tween().delay(0.5), cc.tween().parallel( //后动作3与动作4 cc.tween().to(1, { position: cc.v2(-200, -200) }).to(1, { position: cc.v2(0, -200) }), //动作3,包含两个串行的子动作 cc.tween().to(1, { color: cc.Color.RED }) //动作4 ) ).call(()=>{ console.log('>> repeat once'); //每次repeat可以单独定义回调 }), ).call(()=>{ console.log('>> repeat end');} //整体完成的回调 ).start(); |
——
over
转载请注明出处:http://www.jiangkl.com/2025/02/cocos-tween_timeline