Cocos creator 动作系统

动作系统简介

• 是用于控制物体运动的一套系统，完全依赖代码进行实现，动态调节节点的移动。

移动

• cc.moveTo 移动到某个坐标（x,y）

        //1秒时间内，移动到0,0let action1 = cc.moveTo(1,0,0)this.node.runAction(action1)

• cc.moveBy 在原坐标的基础上加上（x,y）

        //1秒内，相对位置移动500,500let action = cc.moveBy(1,500,500)this.node.runAction(action)

旋转

• cc.rotateTo 旋转到某个角度

        //1秒内，顺时针旋转45度let action = cc.rotateTo(1,45)this.node.runAction(action)

• cc.rotateBy 相对于当前，旋转某个角度
• 顺时针旋转为正数

缩放

• scaleTo缩放到指定比例
• scaleBy缩放一定的比例

        //缩放到一定比例//1秒内，宽高缩放0.5倍let action = cc.scaleTo(1,0.5,0.5)this.node.runAction(action)

跳跃

• jumpTo跳跃到指定位置
• jumpBy

        //1秒内，原地跳跃1次，高度100let action = cc.jumpBy(1,0,0,100,1)this.node.runAction(action)

偏斜

• skewTo 偏斜到某个角度
• skewBy 相对当前偏斜一定角度

        //1秒内，x方向偏斜10度，y不变let action = cc.skewTo(1,10,0)this.node.runAction(action)

贝塞尔移动

• 贝塞尔3个点，组成一个数组
• bezierTo
• bezierBy

        let height = 1920let bezier = [cc.v2(0, height / 2), cc.v2(300, -height / 2), cc.v2(300, 100)];let action = cc.bezierTo(2, bezier);this.node.runAction(action)

闪烁

• 基于透明度的闪烁（0-255），blinks闪烁次数
• blink(duration: number, blinks: number)

        //2秒内，闪烁10次let action = cc.blink(2,10)this.node.runAction(action)

透明度，渐隐，渐显

• fadeTo(duration: number, opacity: number) 透明度动态调节
• fadeIn 渐显
• fadeOut 渐隐

        //1秒内，透明度变为125let action1 = cc.fadeTo(1,125)this.node.runAction(action1)//1秒内，逐渐显示，0变成255let action2 = cc.fadeIn(1)this.node.runAction(action2)//1秒内，逐渐消失let action3 = cc.fadeOut(1)this.node.runAction(action3)

变色

• tintTo(duration: number, red: number, green: number, blue: number)

        //1秒内，变成红色let action = cc.tintTo(1,255,0,0)this.node.runAction(action)

以上是一定时间执行的动作ActionInterval

以下是瞬发执行的动作ActionInstant

显示/隐藏

• cc.show() 显示
• cc.hide() 隐藏
• cc.toggleVisibility() 显示隐藏状态切换

翻转

• flipX(flip: boolean) 水平方向翻转，flip是否翻转
• flipY 竖直方向翻转

            this.moveX = this.x2 - this.x1//人物的转向if (this.moveX < -10) {this.player.node.runAction(cc.flipX(true))} else if (this.moveX > 10) {this.player.node.runAction(cc.flipX(false))}

定位

• place(pos: Vec2|number, y?: number) 瞬移到某个位置

动作控制

• runAction 执行动作
• stopAction 停止动作
• stopAllAction 停止所有动作
• action.setTag(tag: number) 设置动作标签
• stopActionByTag 停止指定标签的动作
• pauseAllActions 暂停所有动作
• resumeAllActions 恢复所有动作

动作容器

• 创建动作序列

• var seq = cc.sequence(act1, act2); 如果要在两个action中间加入间隔时间，则使用cc.delayTime产生的ActionInterval对象

• 重复执行动作

• let repeat = cc.repeat(action,times)

• let repeat = cc.repeatForver(action)

• 并列执行多个动作

• let spawn = cc.spawn(a1,a2…)

缓动动作

• easeIn
• easeOut
• easeInOut 先快后慢
• action.easing(cc.easeIn(3))//设置缓动动作，加速运动
• 还有更多的ease方法，可以看API文档

Tween对象

• Tween代替了原来的Action
• 使用链式代码创建一个动作序列
• 支持与Action的混用

        cc.tween(this.node)//2秒移动到(500,500)，同时旋转180度，同时增加一个缓动动画.to(2, {x: 500, y: 500, angle: 180}, cc.easeInOut(2))//以上动作完成后等待2秒.delay(2)//以上完成后的回调.call(() => {console.log('回调');})//1秒内，放大2倍.to(1, {scaleX: 2, scaleY: 2})//相对动作.by(1, {angle: 180}).start()