Cocos备忘录

经常有些东西久了不用就忘了... 直接记到这里好了...

一 toggle按钮

二 tween基本用法

三按钮点击监听的e

四按钮或图片置灰

五 schedule无限执行

六取有效小数位

七贝塞尔曲线

八 spine动画的事件

九文本的颜色

十 Date

一 toggle按钮

类似这种菜单单选按钮，创建ToggleContainer组件。

cocos里没有监听toggleContainer容器的方法？貌似只能监听单个按钮。

this.toggle1.node.on("toggle", this.onToggleTap, this);
this.toggle2.node.on("toggle", this.onToggleTap, this);
this.toggle3.node.on("toggle", this.onToggleTap, this);

处理的时候

    private onToggleTap(toggle: cc.Toggle) {
        switch (toggle) {
            case this.toggle1:
                
                break;
            case this.toggle2:
              
                break;
            case this.toggle3:
               
                break;
        }
    }

二 tween基本用法

无限循环，让一个方块rect不停的旋转。

cc.tween(this.rect).repeatForever(
       cc.tween(this.rect).to(2, { angle: 360 }).to(0, { angle: 0 })
 ).start();

停止目标所有tween，以下三个最终都是调用removeAllActionsFromTarget，所以是等效的。不过cocos源码里有cc.Tween.stopAllByTarget，但是用起来却提示找不到这个function。

cc.director.getActionManager().removeAllActionsFromTarget(this.node);

this.node.stopAllActions();

cc.Tween.stopAllByTarget(this.node);

缓动，设置目标角度为0，并且缓动quadInOut到360度。没找到quadInOut的常量，只能硬写个字符串。　　

cc.tween(this.node).set({ angle: 0 }).to(1, { angle: 360 }, { easing: 'quadInOut' }).call(() => {}).start();

重复指定的次数

cc.tween(this).repeat(1,
            cc.tween(this).to(1, { y: 420 }).call(() => { this.node.y = 0 })
).to(1, { y: 10 });

三按钮点击监听的e

this.node.on(cc.Node.EventType.TOUCH_END, this.onTouchEnd, this);
this.node.on("click", this.onClick, this);

两种事件的传递的参数e

private onTouchEnd(e:cc.Event.EventTouch){
    console.log("touchend:", e);
}

private onClick(e:cc.Button){
    console.log("click:", e);
}

四按钮或图片置灰

按钮置灰可以勾选Enable Auto Gray Effect

设置按钮interactable = false则图片置灰

btn.interactable = false;

可以直接设置某个图片置灰

let sp:cc.Sprite;
sp.setMaterial(0, cc.Material.createWithBuiltin("2d-gray-sprite", 0));

五 schedule无限执行

this.schedule(() => { }, 1, cc.macro.REPEAT_FOREVER);

六取有效小数位

var num: number = 123.456;
cc.log(num.toPrecision(2));    //1.2e+2
cc.log(num.toFixed(2));        //123.46
cc.log( num.toExponential(2)); //1.23e+2

七贝塞尔曲线

2秒钟从坐标(0,0)曲线运动到(10,10)，再运动到(0,20)

let startPos = cc.v2(0,0);        //起始点
let controlPos = cc.v2(10,10); //拐点
let endPos = cc.v2(0,20);        //终点
var action = cc.bezierTo(2, [startPos,controlPos,endPos]);
this.node.runAction(action);

八 spine动画的事件

var s: sp.Skeleton;
s.setAnimation(0, "run", false);  //在track0播放动画"run"，不循环
s.setCompleteListener((trackEntry, loopCount) => {
       let name = trackEntry.animation.name;  //完成的动画名
});
s.setEventListener((trackIndex, event) => {
        let name = event.data.name;  //触发的事件名
});
s.setSkin("01");  //替换皮肤

//加载动画
cc.loader.loadRes("hero01" , sp.SkeletonData, (err, res)=>{
      s.skeletonData = res;
});

九文本的颜色

容易忘记的是 new cc.Color.fromHEX...

let richText: cc.RichText = new cc.RichText();
richText.node.color = new cc.Color().fromHEX("#00fe18");
richText.string = "<outline color=#000000 width=1><color=#ffffff>文本</color></outline>";

十 Date

月份要+1，比如四月，getMonth返回的是3。

 let date:Date = new Date();
cc.log(date.getTime());     //1617242699764  1970 年 1 月 1 日至今的毫秒数
cc.log(date.getFullYear()); //2021  2021年
cc.log(date.getMonth()+1);  //4     四月
cc.log(date.getDate());     //1     1日
cc.log(date.getHours());    //10    早上10点
cc.log(date.getMinutes());  //6     6分
cc.log(date.getSeconds());  //59    59秒
cc.log(date.getDay());      //4 星期四