Timer 是时钟管理类,是一个单例,无需手动实例化,直接使用 Laya.Time 访问。
构造函数
new Laya.Timer(autoActive?:boolean):Timer
结构 | 值 |
---|---|
Package | laya.utils |
Class | Laya.Timer |
Inheritance | Timer / Object |
属性 | 类型 | 默认值 | 描述 |
---|---|---|---|
currFrame | int | 0 | 当前帧数 |
currTime | Number | Date.now() | 当前帧开始的时间 |
scale | Number | 1 | 时针缩放 |
存取器 | 类型 | 描述 |
---|---|---|
delta | number | [read-only] 两帧之间的时间毫秒间隔 |
方法 | 参数 | 返回值 | 描述 |
---|---|---|---|
callLater() | caller: any, method: Function, args?: any[] | void | 延迟执行 |
once() | delay: number, caller: any, method: Function, args?: any[], coverBefore?: boolean | void | 定时器基于毫秒执行一次 |
frameOnce() | delay: number, caller: any, method: Function, args?: any[], coverBefore?: boolean | void | 定时器基于帧率执行一次 |
loop() | delay: number, caller: any, method: Function, args?: any[], coverBefore?: boolean, jumpFrame?: boolean | void | 定时器基于毫秒重复执行 |
frameLoop() | delay: number, caller: any, method: Function, args?: any[], coverBefore?: boolean | void | 定时器基于帧率重复执行 |
pause() | void | 暂停时钟 | |
resume() | void | 恢复时钟 | |
clear() | caller: any, method: Function | void | 清理定时器 |
clearAll() | caller: any | void | 清理对象身上的所有定时器 |
runCallLater() | caller: any, method: Function | void | 立即执行callLater |
runTimer() | caller: any, method: Function | void | 立即提前执行定时器,执行之后从队列中删除。 |
Timer
表示游戏主时针,同时也是管理场景、动画、缓动等效果时钟,通过控制本时钟缩放可以达到快进慢播的效果。
延迟调用callLater
/***
* 延迟执行一次
* @param caller 执行域this
* @param method 定时器回调函数,只会执行一次。
* @param args 回调参数
*/
callLater(
caller:any,
method:Function,
args?:Array<any>
):void
多次调用callLater
函数,只会执行一次自己的回调函数。
class Test {
constructor() {
Laya.init(Laya.stage.designWidth, Laya.stage.designHeight, Laya.WebGL);
this.initStage();
Laya.Stat.show();
this.run();
}
initStage(){
Laya.stage.alignH = Laya.Stage.ALIGN_CENTER;
Laya.stage.alignV = Laya.Stage.ALIGN_MIDDLE;
Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL;
Laya.stage.bgColor = "#000000";
}
run(){
for(let i=0; i<10; i++){
//定时器回调函数只会执行一次
Laya.timer.callLater(this, this.onCallLater);
}
}
onCallLater(){
console.log("onCallLater triggered");
let text = new Laya.Text();
text.font = "SimHei";
text.fontSize = 30;
text.color = "#FFFFFF";
text.text = "test";
text.size(Laya.stage.width, Laya.stage.height);
text.align = "center";
text.valign = "middle";
Laya.stage.addChild(text);
}
}
//启动
new Test();
例如:每次点击文字标签,文件内容变化并渐隐。
class Test {
constructor() {
this.alpha = 1;
Laya.init(Laya.Browser.width, Laya.Browser.height, Laya.WebGL);
this.initStage();
this.initLabel("alpha=1");
}
initStage(){
Laya.stage.alignH = Laya.Stage.ALIGN_CENTER;
Laya.stage.alignV = Laya.Stage.ALIGN_MIDDLE;
Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL;
Laya.stage.bgColor = "#000000";
}
initLabel(text){
this.label = new Laya.Label(text);
this.label.fontSize = 40;
this.label.color = "#FFF";
this.label.pos((Laya.stage.width-this.label.width)/2, (Laya.stage.height-this.label.height)/2);
Laya.stage.addChild(this.label);
this.label.on(Laya.Event.CLICK, this, function(){
Laya.timer.callLater(this, this.onCallLater);
});
}
onCallLater(obj){
console.log(this.label);
this.alpha = this.alpha <= 0 ? 1 : this.alpha - 0.1;
this.label.alpha = this.alpha;
this.label.text = `alpha=${this.alpha}`;
this.label.pos((Laya.stage.width-this.label.width)/2, (Laya.stage.height-this.label.height)/2);
}
}
//启动
new Test();
延迟执行 once
基于毫秒定时执行一次
/**
* 定时执行一次
* @param delay:number 延迟毫秒
* @param caller:any 执行域this
* @param method:Function 定时回调函数
* @param args:any[] = null 回调参数
* @ coverBefore:boolean = true 是否覆盖之前的延迟执行
*/
once(
delay:number,
caller:any,
method:Function,
args?:any[],
coverBefore?:boolean
):void
class Test {
constructor() {
Laya.init(Laya.Browser.width, Laya.Browser.height, Laya.WebGL);
this.initStage();
this.initLabel("点我0.5秒后执行");
}
initStage(){
Laya.stage.alignH = Laya.Stage.ALIGN_CENTER;
Laya.stage.alignV = Laya.Stage.ALIGN_MIDDLE;
Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL;
Laya.stage.bgColor = "#000000";
}
initLabel(text){
this.label = new Laya.Label(text);
this.label.fontSize = 40;
this.label.color = "#FFF";
this.label.pos((Laya.stage.width-this.label.width)/2, (Laya.stage.height-this.label.height)/2);
Laya.stage.addChild(this.label);
//为label绑定单击事件
this.label.on(Laya.Event.CLICK, this, this.onLabelClick);
}
onLabelClick(){
//移除鼠标单击事件
this.label.off(Laya.Event.CLICK, this, this.onLabelClick)
//once在延迟指定时间后执行一次,单位为毫秒;如果多次调用
Laya.timer.once(500, this, function(){
this.label.color = "#FF0000";
});
}
}
//启动
new Test();
基于帧率定时执行一次
/**
* 基于帧率定时执行一次
* @param delay:number 延迟帧数
* @param caller:any 执行域 this
* @param method:Function 定时回调函数
* @param args:any[] = null 回调参数
* @param coverBefore:boolean = true 是否覆盖之前的延迟执行
*/
frameOnce(
delay:number,
caller:any,
method:Function,
args?:any[],
coverBefore?:boolean
):void
class Test {
constructor() {
Laya.init(Laya.Browser.width, Laya.Browser.height, Laya.WebGL);
this.initStage();
this.initButton("点我60帧后执行");
}
initStage(){
Laya.stage.alignH = Laya.Stage.ALIGN_CENTER;
Laya.stage.alignV = Laya.Stage.ALIGN_MIDDLE;
Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL;
Laya.stage.bgColor = "#000000";
}
initButton(text, width = 300, height = 60){
this.button = new Laya.Sprite();
Laya.stage.addChild(this.button);
this.button.size(width, height);
this.button.graphics.drawRect(0, 0, width, height, "#FF0000");
this.button.graphics.fillText(text, width/2, 17, "20px simHei", "#FFFFFF", "center");
this.button.pos((Laya.stage.width - this.button.width)/2, (Laya.stage.height - this.button.height)/2);
this.button.on(Laya.Event.CLICK, this, this.onClick);
}
onClick(){
//移除鼠标单击事件
this.button.off(Laya.Event.CLICK, this, this.onClick)
//frameOnce在延迟指定帧数后执行一次,单位为毫秒;如果多次调用
Laya.timer.frameOnce(60, this, function(){
this.button.alpha -= 0.5;
});
}
}
//启动
new Test();
间隔循环 loop
laya.utils.Timer
中关于间隔循环执行的方式有两种,分别是以时间循环执行loop()
和按帧率循环执行的frameLoop()
。
/**
* 按指定毫秒定时重复执行
* @param delay:int 间隔毫秒时间
* @param caller:* 执行域`this`
* @param method:Function 定时器回调函数
* @param args:Array(default=null) 回调参数
* @param coverBefore:Boolean(default=true) 是否覆盖之前的延迟执行
*/
loop(
delay:int,
caller:*,
method:Function,
args:Array=null,
coverBefore:Boolean=true
):void
class Test {
constructor() {
Laya.init(Laya.Browser.width, Laya.Browser.height, Laya.WebGL);
this.initStage();
this.initText("基于时间旋转");
}
initStage(){
Laya.stage.alignH = Laya.Stage.ALIGN_CENTER;
Laya.stage.alignV = Laya.Stage.ALIGN_MIDDLE;
Laya.stage.scaleMode = Laya.Stage.SCALE_SHOWALL;
Laya.stage.bgColor = "#000000";
}
initText(text){
this.text = new Laya.Text();
this.text.fontSize = 30;
this.text.color = "white";
this.text.bold = true;
this.text.text = text;
this.text.pos((Laya.stage.width - this.text.width)/2, (Laya.stage.height-this.text.height)/2);
this.text.pivot(this.text.width/2, this.text.height/2);
Laya.stage.addChild(this.text);
//loop:定时重复执行(基于时间,单位为毫秒)
Laya.timer.loop(200, this, this.onLoop);
}
onLoop(){
//旋转
this.text.rotation += 10;
}
}
//启动
new Test();
/**
* 文本数字增减渐变效果
* @param begin {number} 开始的数值
* @param end {number} 渐变到的数值
* @param callback {Function} 淡出完成回调函数
* @param thisObj {any} 回调函数的this对象
*/
flownum(begin, end, callback, thisObj=null){
let diff = Math.abs(end - begin);
if(diff <= 0){
return;
}
let cur = begin;
let per = diff / (end - begin);
let delay = 30;
let timer = new Laya.Timer();
timer.loop(delay, this, onLoop);
function onLoop(){
cur += per;
--diff;
if(diff < 0){
timer.clearAll(this);
timer = null;
}else{
callback && callback.apply(thisObj, [cur]);
}
}
}