5.cc.Node(四)Action的使用

1. Action

Action类是动作命令，我们创建Action,然后节点运行action就能够执行Action的动作;
Action分为两类: (1) 瞬时就完成的ActionInstant, (2) 要一段时间后才能完成ActionIntervial;
cc.Node runAction: 节点运行action;
cc.moveTo, cc.moveBy  To: 目标 By: 变化
cc.roateBy, cc.rotateTo,
cc.scaleBy, cc.scaleTo,
cc.fadeOut(淡出), cc.fadeIn(淡入):  cc.fadeTo();
cc.callFunc, cc.delayTime
cc.sequnce, cc.repeat, cc.repeatForever
Action easing(缓动的方式):  加上缓动特效, cc.easeXXXXX查看文档设置自己想要的缓动对象
stopAction: 停止运行action
stopAllActions: 停止所有的action;

例:action_test.js

// Learn cc.Class:
//  - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/class.html
//  - [English] http://docs.cocos2d-x.org/creator/manual/en/scripting/class.html
// Learn Attribute:
//  - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/reference/attributes.html
//  - [English] http://docs.cocos2d-x.org/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/life-cycle-callbacks.html
//  - [English] https://www.cocos2d-x.org/docs/creator/manual/en/scripting/life-cycle-callbacks.html

cc.Class({
    extends: cc.Component,

    properties: {
        // foo: {
        //     // ATTRIBUTES:
        //     default: null,        // The default value will be used only when the component attaching
        //                           // to a node for the first time
        //     type: cc.SpriteFrame, // optional, default is typeof default
        //     serializable: true,   // optional, default is true
        // },
        // bar: {
        //     get () {
        //         return this._bar;
        //     },
        //     set (value) {
        //         this._bar = value;
        //     }
        // },
    },

    // LIFE-CYCLE CALLBACKS:

    onLoad () {

        //move  直接移动到目标位置
        //var mto = cc.moveTo(1, cc.v2(100, 100));
        //this.node.runAction(mto);

        //moveBy  x,y变化多少
        var mby = cc.moveBy(1, cc.v2(100, 100));
        this.node.runAction(mby);

        //rotate  旋转到目标角度，通过逐帧修改它的 rotation 属性，旋转方向将由最短的角度决定。
        // var rto = cc.rotateTo(1, 180);
        // this.node.runAction(rto);

        //在原来的基础上变化75度  可以为正,负
        var rby = cc.rotateBy(1, 75);
        this.node.runAction(rby);

        //scale 将节点大小缩放到指定的倍数 放大2倍
        // var sto = cc.scaleTo(1, 2);
        // this.node.runAction(sto);

        //在原来的基础上放大  按指定的倍数缩放节点大小
        var sby = cc.scaleBy(1, 1.5);
        this.node.runAction(sby);

        //渐显效果(淡入) 参数为时间
        // this.node.opacity = 0; //设置透明度为0
        // var fin = cc.fadeIn(1);
        // this.node.runAction(fin);

        //淡出
        //var fout = cc.fadeOut(1);
        //this.node.runAction(fout); //只是透明度为0 物体还在

        //修改透明度到指定值
        var fto = cc.fadeTo(1, 128);
        this.node.runAction(fto);

        //action的函数调用
        var func = cc.callFunc(function() {
            console.log("call func action");
        });
        console.log("begin-------");
        this.node.runAction(func);
        console.log("end-------");

        //移动到目的地后隐藏物体 可以使用命令清单,[action, action2, action3]
        //seq
        // var m1 = cc.moveTo(1, 100, 100);
        // var fout = cc.fadeOut(0.5);
        // //顺序执行动作，创建的动作将按顺序依次运行。
        // var seq = cc.sequence([m1, fout]);
        // this.node.runAction(seq);

        //一个节点可以同时运行多个action
        var m1 = cc.moveTo(1, 100, 0).easing(cc.easeBackOut()); //缓动运动,缓动特效
        var fout = cc.fadeOut(0.5);
        this.node.runAction(m1);
        this.node.runAction(fout);

        //循环执行action
        //不断地放大缩小
        var s1 = cc.scaleTo(0.8, 1.1);
        var s2 = cc.scaleTo(0.8, 0.8);
        var seq = cc.sequence([s1, s2]);
        var rf = cc.repeatForever(seq);
        this.node.runAction(rf);

        //停止action
        // this.node.stopAction(rf);
        // this.node.stopAllActions();

        //cc.Delay 延时
        var d1 = cc.delayTime(3);
        var fout = cc.fadeOut(0.5);
        var end_func = cc.callFunc(function() {
            this.node.removeFromParent();
        });
        //延时消失
        var seq = cc.sequence([d1, fout, end_func]);
        this.node.runAction(seq);

    },

    start () {

    },

    // update (dt) {},
});

工程截图: