LayaAir 定时器 Timer

最新推荐文章于 2024-03-29 22:25:05 发布
最新推荐文章于 2024-03-29 22:25:05 发布
阅读量1.1w 收藏 9
点赞数 4
分类专栏： Layabox(JS)
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wangmx1993328/article/details/86007162
版权

 

目录

Timer 

编码示例

callLater 延迟调用

延迟执行

间隔循环

时钟暂停与恢复

结束定时器

优化策略

Timer 

Packagelaya.utils
类public class Timer
InheritanceTimer Inheritance Object

Timer 是时钟管理类，它是一个单例，不要手动实例化此类，应该通过 Laya.timer 访问。 

Property（属性）
currFrame : int = 0 ，当前的帧数。
currTimer : Number ，当前帧开始的时间。
delta : int ，[read-only] 两帧之间的时间间隔,单位毫秒。
scale : Number = 1 ，时针缩放。
Method（方法）

callLater(caller:*, method:Function, args:Array = null):void ，延迟执行。

clear(caller:*, method:Function):void ，清理定时器。

clearAll(caller:*):void ，清理对象身上的所有定时器。

frameLoop(delay:int, caller:*, method:Function, args:Array = null, coverBefore:Boolean = true):void ，定时重复执行(基于帧率)。

frameOnce(delay:int, caller:*, method:Function, args:Array = null, coverBefore:Boolean = true):void ，定时执行一次(基于帧率)。

loop(delay:int, caller:*, method:Function, args:Array = null, coverBefore:Boolean = true, jumpFrame:Boolean = false):void

定时重复执行。

once(delay:int, caller:*, method:Function, args:Array = null, coverBefore:Boolean = true):void ，定时执行一次。

pause():void ，暂停时钟

resume():void ，恢复时钟

runCallLater(caller:*, method:Function):void ，立即执行 callLater 。

runTimer(caller:*, method:Function):void ，立即提前执行定时器，执行之后从队列中删除

编码示例

callLater 延迟调用

/**延迟执行一次
 * @param   caller 执行域(this)。
 * @param   method 定时器回调函数——只会执行一次
 * @param   args 回调参数。
 */
callLater(caller: any, method: Function, args?: Array<any>): void;

实现上述效果有很多的方式，这里以使用 callLater 函数为例进行说明。为 label 绑定单击事件，每点击一次label，则调用一次 callLater 方法，callLater 函数会执行一次自己的回调函数，在回调函数中修改 label  的透明度 alpha。

纯粹是为了演示用法，这个需求并不适合使用 callLater 函数，实现代码如下：

(function () {
    Laya.init(1080, 1920, Laya.WebGL);//初始化引擎，不支持WebGL时自动切换至Canvas
    Laya.stage.bgColor = "#252525";

    /**创建一个 label*/
    var label_info = createLabel("alpha=1");
    label_info.pos(250, 20);//组建显示的位置

    /**为label绑定单击事件 */
    label_info.on(Laya.Event.CLICK, this, function () {
        /**callLater：延迟执行，调用会马上执行其回调函数 */
        Laya.timer.callLater(this, animation, []);
        /**无论循环多次，callLater 也只会执行一次 animation ；只有下次点击进入时才会再次执行*/
        /* for (let i = 0; i < 10; i++) {
            Laya.timer.callLater(this, animation, []);
        } */
    });

    /** alpha_flag:为 true 时，label 的alpha值减小；为 false 时，label 的alpha值增加；*/
    var alpha_flag = true;
    function animation() {
        if (alpha_flag) {
            /**alpha：透明度，值为0-1，默认值为1，表示不透明 */
            label_info.alpha -= 0.2;
        } else {
            label_info.alpha += 0.2;
        }
        alpha_flag = label_info.alpha <= 0.1 ? false : alpha_flag;
        alpha_flag = label_info.alpha >= 1 ? true : alpha_flag;
        /**改变label的文本值
         * Number 的 toFixed 用于设置小数点位数，会四舍五入*/
        label_info.text = "alpha=" + label_info.alpha.toFixed(2);
    }

    //创建一个标签并添加到舞台
    function createLabel(message) {
        var label = new Laya.Label(message);
        label.fontSize = 30;//文本的字体大小
        label.color = "#fff";//文本颜色
        Laya.stage.addChild(label);//添加到舞台显示
        return label;
    }
})();

官网 demo：https://layaair.ldc.layabox.com/demo2/?language=ch&category=2d&group=Timer&name=CallLater

延迟执行

/**
 * 定时执行一次。
 * @param   delay   延迟时间(单位为毫秒)。
 * @param   caller  执行域(this)。
 * @param   method  定时器回调函数。
 * @param   args    回调参数。
 * @param   coverBefore 是否覆盖之前的延迟执行，默认为 true 。
 */
once(delay: number, caller: any, method: Function, args?: Array<any>, coverBefore?: boolean): void;

/**
 * 定时执行一次(基于帧率)。
 * @param   delay   延迟几帧(单位为帧)。
 * @param   caller  执行域(this)。
 * @param   method  定时器回调函数。
 * @param   args    回调参数。
 * @param   coverBefore 是否覆盖之前的延迟执行，默认为 true 。
 */
frameOnce(delay: number, caller: any, method: Function, args?: Array<any>, coverBefore?: boolean): void;

实现代码如下：

(function () {
    Laya.init(1080, 1920, Laya.WebGL);//初始化引擎，不支持WebGL时自动切换至Canvas
    Laya.stage.bgColor = "#252525";

    /**创建 label*/
    var label_info = createLabel("点我0.5秒后执行");
    var label_show = createLabel("点我30帧后执行");
    label_info.pos(100, 20);//组建显示的位置
    label_show.pos(400, 20);//组建显示的位置

    /**为label绑定单击事件 */
    var isLeft = false;
    label_info.on(Laya.Event.CLICK, this, function () {
        /**once在延迟指定时间后执行一次，单位为毫秒；如果多次调用 */
        Laya.timer.once(500, this, function () {
            if (isLeft) {
                label_info.x = label_info.x + 50;
                label_info.color = "#fff";
                isLeft = false;
            } else {
                label_info.x = label_info.x - 50;
                label_info.color = "#ff0";
                isLeft = true;
            }
        });
    });

    /**为label绑定单击事件 */
    var isRight = false;
    label_show.on(Laya.Event.CLICK, this, function () {
        /**frameOnce:基于帧率，在指定延迟后执行一次回调函数 */
        Laya.timer.frameOnce(30, this, function () {
            if (isRight) {
                label_show.x = label_show.x - 50;
                label_show.alpha = 1;
                isRight = false;
            } else {
                label_show.x = label_show.x + 50;
                label_show.alpha = 0.5;
                isRight = true;
            }
        });
    });

    //创建一个标签并添加到舞台
    function createLabel(message) {
        var label = new Laya.Label(message);
        label.fontSize = 30;//文本的字体大小
        label.color = "#fff";//文本颜色
        Laya.stage.addChild(label);//添加到舞台显示
        return label;
    }
})();

官网 demo：https://layaair.ldc.layabox.com/demo2/?language=ch&category=2d&group=Timer&name=DelayExcute

间隔循环

/**
 * 定时重复执行。
 * @param   delay   间隔时间(单位毫秒)。
 * @param   caller  执行域(this)。
 * @param   method  定时器回调函数。
 * @param   args    回调参数。
 * @param   coverBefore 是否覆盖之前的延迟执行，默认为 true 。
 * @param   jumpFrame 时钟是否跳帧。基于时间的循环回调，单位时间间隔内，如能执行多次回调，出于性能考虑，引擎默认只执行一次，设置jumpFrame=true后，则回调会连续执行多次
 */
loop(delay: number, caller: any, method: Function, args?: Array<any>, coverBefore?: boolean, jumpFrame?: boolean): void;

/**
 * 定时重复执行(基于帧率)。
 * @param       delay   间隔几帧(单位为帧)。
 * @param       caller  执行域(this)。
 * @param       method  定时器回调函数。
 * @param       args    回调参数。
 * @param       coverBefore     是否覆盖之前的延迟执行，默认为 true 。
 */
frameLoop(delay: number, caller: any, method: Function, args?: Array<any>, coverBefore?: boolean): void;

实现代码如下：

(function () {
    Laya.init(1080, 1920, Laya.WebGL);//初始化引擎，不支持WebGL时自动切换至Canvas
    Laya.Stat.show(0, 0);/**显示性能统计面板 */
    Laya.stage.bgColor = "#252525";

    /**创建 label*/
    var label_info = createLabel("I am Loop");
    var label_show = createLabel("I am frameLoop");
    label_info.pos(Laya.Browser.clientWidth, 20);//组建显示的位置
    label_show.pos(Laya.Browser.clientWidth, 80);//组建显示的位置

    /**loop：定时重复执行(基于时间，单位为毫秒)
     * frameLoop：定时重复执行(基于帧率)*/
    Laya.timer.loop(40, this, animation_loop);
    Laya.timer.frameLoop(2, this, animation_frameLoop);

    function animation_loop() {
        label_info.x -= 2;
        if (label_info.x + label_info.width < 0) {
            label_info.x = Laya.Browser.clientWidth;
        }
    }

    function animation_frameLoop() {
        label_show.x -= 2;
        if (label_show.x + label_show.width < 0) {
            label_show.x = Laya.Browser.clientWidth;
        }
    }

    //创建一个标签并添加到舞台
    function createLabel(message) {
        var label = new Laya.Label(message);
        label.fontSize = 30;//文本的字体大小
        label.color = "#fff";//文本颜色
        Laya.stage.addChild(label);//添加到舞台显示
        return label;
    }
})();

时钟暂停与恢复

/**
 * 暂停时钟————暂停所有 Timer
 */
pause(): void;
/**
 * 恢复时钟————恢复所有 Timer
 */
resume(): void;

实现代码如下：

(function () {
    Laya.init(1080, 1920, Laya.WebGL);//初始化引擎，不支持WebGL时自动切换至Canvas
    Laya.Stat.show(0, 0);/**显示性能统计面板 */
    Laya.stage.bgColor = "#252525";

    /**创建 label*/
    var label_info = createLabel("I am Loop");
    var label_show = createLabel("I am frameLoop");
    var label_btn = createLabel("定时器暂停");
    label_info.pos(Laya.Browser.clientWidth, 20);//组件显示的位置
    label_show.pos(Laya.Browser.clientWidth, 80);//组件显示的位置
    label_btn.pos(Laya.Browser.clientWidth / 2, 150);//组件显示的位置

    /**loop：定时重复执行(基于时间，单位为毫秒)
     * frameLoop：定时重复执行(基于帧率)*/
    Laya.timer.loop(40, this, animation_loop);
    Laya.timer.frameLoop(2, this, animation_frameLoop);

    function animation_loop() {
        label_info.x -= 2;
        if (label_info.x + label_info.width < 0) {
            label_info.x = Laya.Browser.clientWidth;
        }
    }

    function animation_frameLoop() {
        label_show.x -= 2;
        if (label_show.x + label_show.width < 0) {
            label_show.x = Laya.Browser.clientWidth;
        }
    }

    var isStop = false;
    label_btn.on(Laya.Event.CLICK, this, function () {
        if (isStop) {
            Laya.timer.resume();/**恢复时钟 */
            label_btn.text = "定时器运行";
            label_btn.color = "#fff";
            isStop = false;
        } else {
            Laya.timer.pause();/**暂停时钟 */
            label_btn.text = "定时器暂停";
            label_btn.color = "#f00";
            isStop = true;
        }
    });

    //创建一个标签并添加到舞台
    function createLabel(message) {
        var label = new Laya.Label(message);
        label.fontSize = 30;//文本的字体大小
        label.color = "#fff";//文本颜色
        Laya.stage.addChild(label);//添加到舞台显示
        return label;
    }
})();

结束定时器

/**
 * 清理定时器。
 * @param   caller 执行域(this)。——定时器与 clear 必须是同一个对象
 * @param   method 定时器回调函数。——定时器回调函数的名称
 */
clear(caller: any, method: Function): void;

/**
 * 清理对象身上的所有定时器。
 * @param   caller 执行域(this)。——定时器与 clear 必须是同一个对象
 */
clearAll(caller: any): void;

对于在某个时刻需要清理/结束的定时器，在指定定时器与清理定时时，执行域都指定为 Laya.stage，而不再是 this。

实现代码如下：

(function () {
    Laya.init(1080, 1920, Laya.WebGL);//初始化引擎，不支持WebGL时自动切换至Canvas
    Laya.Stat.show(0, 0);/**显示性能统计面板 */
    Laya.stage.bgColor = "#252525";

    /**创建 label*/
    var label_info = createLabel("I am Loop");
    var label_show = createLabel("I am frameLoop");
    var label_btn = createLabel("结束第1个定时器");
    var label_btn_2 = createLabel("结束第所有定时器");

    label_info.pos(Laya.Browser.clientWidth, 20);//组件显示的位置
    label_show.pos(Laya.Browser.clientWidth, 80);//组件显示的位置
    label_btn.pos(Laya.Browser.clientWidth / 4, 150);//组件显示的位置
    label_btn_2.pos(Laya.Browser.clientWidth * (2 / 3), 150);//组件显示的位置

    /**loop：定时重复执行(基于时间，单位为毫秒)
     * frameLoop：定时重复执行(基于帧率)
     * 对于将来某个时刻需要清理的定时器，执行域设置为 Laya.stage，清理时的执行域也是 Laya.stage，如果使用 this，则定时器会结束不了*/
    Laya.timer.loop(40, Laya.stage, animation_loop);
    Laya.timer.frameLoop(2, Laya.stage, animation_frameLoop);

    function animation_loop() {
        label_info.x -= 2;
        if (label_info.x + label_info.width < 0) {
            label_info.x = Laya.Browser.clientWidth;
        }
    }

    function animation_frameLoop() {
        label_show.x -= 2;
        if (label_show.x + label_show.width < 0) {
            label_show.x = Laya.Browser.clientWidth;
        }
    }

    label_btn.on(Laya.Event.CLICK, this, function () {
        /**清理指定的定时器，通过函数名确定
         * 清理定时器同样执行域为 Laya.stage */
        Laya.timer.clear(Laya.stage, animation_loop);
    });


    label_btn_2.on(Laya.Event.CLICK, this, function () {
        /**清理对象身上的所有定时器
         * 清理定时器同样执行域为 Laya.stage */
        Laya.timer.clearAll(Laya.stage);
    });

    //创建一个标签并添加到舞台
    function createLabel(message) {
        var label = new Laya.Label(message);
        label.fontSize = 30;//文本的字体大小
        label.color = "#fff";//文本颜色
        Laya.stage.addChild(label);//添加到舞台显示
        return label;
    }
})();

当一个对象的生命周期结束时，记得清除其内部的Timer。

优化策略

1、不要在 Timer 的循环里创建对象及复杂计算。

2、由于Timer的loop()与frameLoop()方法里会不断的循环执行，当创建对象及复杂计算时，会导致大量的性能消耗出现在循环里，因此尽可能不要在循环里创建对象及复杂计算。

 

蚩尤后裔-汪茂雄
关注
专栏目录
laya实现倒计时
m0_58964000的博客
07-29 1200
laya实现倒计时
如何利用状态同步开发一款联机游戏
m0_37767807的博客
01-04 964
游戏状态同步 1.前言 目前市场上单机游戏占比高，因为相对联机游戏开发周期短、成本低，但联机游戏的社交属性强，玩家粘性高。总体来说，开发联机游戏有一定的技术门槛。 2.帧同步和状态同步 • 帧同步过程为各客户端实时上传操作指令集；服务端保存这些操作指令集，并在下一帧将其广播给所有客户端；客户端收到指令集后分别按帧序执行指令集中的操作。同步的是玩家的操作指令，该方式多用于对实时性要求很高的网络游戏。 • 状态同步过程为客户端上传操作到服务端，服务端收到后计算游戏行为的结果，即...
《laya 源码分析》Timer 详解
weixin_41640571的博客
12-11 1167
挖坑挖坑。后续埋
Laya Timer
JunChow
10-09 1154
Timer 是时钟管理类，是一个单例，无需手动实例化，直接使用 Laya.Time 访问。 构造函数 new Laya.Timer(autoActive?:boolean):Timer 结构 值 Package laya.utils Class Laya.Timer Inheritance Timer / Object 属性 类型 默认值 描述 ...
Laya 实操五：定时器
JPF29
07-02 2144
定时器 export default class Test extends Laya.Script { constructor() { super(); } onStart(){ //n帧后运行一次 //Laya.timer.frameOnce(300,this,function(){console.log("ok");}); //每隔n帧，循环运行 //Laya.timer.frameLoop(300,this,fu.
Laya1.x Timer小记
weixin_34293141的博客
10-08 363
Timer是时钟管理类，在Laya初始化的时候会创建一个实例，通过Laya.timer访问。 TimerHandler TimerHandler是对每一个定时任务的封装，每次调用frameOnce、frameLoop、once、loop或者callLayer都会产生一个TimerHandler实例。 TimerHandler会缓存传入的参数（args)，当定时器触发时，会将对应的args传递给对...
LayaBox怎么添加定时器
anquanxie2713的博客
12-12 440
//显示完成停留方法 public showComplete():void{ if(this.isShow && !this.isHit){ Laya.timer.once(500,this,this.Hide); //表示（延迟）500毫秒后执行当前类下面的Hide方法 } } ...
LayaAir 简单飞机大战
03-26
在《LayaAir简单飞机大战》中，可能通过Laya.timer模块设置定时器来控制敌机的生成间隔、子弹的发射频率等。计时器配合帧循环可以实现游戏的实时同步，确保游戏节奏的稳定。 5. 其他关键技术：游戏中可能还涉及到了...
CountDown.rar
09-19
在LayaAir中，我们可能使用Laya.timer来实现相同的功能，其API更加适合游戏和动画环境。 最后，到达指定时间后的烟花效果可能通过Laya的动画系统来实现。Laya提供了一系列用于创建、播放和控制动画的方法。开发者...
laya实现文本逐个显示出来
07-11
然后定义了一个名为`showTextByChar`的函数，该函数通过Laya.timer定时器每隔一段时间截取文本的一部分字符，并将其赋值给文本对象，实现逐个显示的效果。最后通过调用`showTextByChar`函数来启动逐个显示文本的过程...
Laya Timer原理 & 源码解析
ddmm2012的博客
03-18 509
Laya Timer原理 & 源码解析 @author ixenos 2019-03-18 16:26:38 一、原理 1.将所有Handler注册到池中 　　1.普通Handler在handlers数组中 　　2.callLatter的Handler在laters数组中 2.然后按定义的执行时刻（或执行帧）进行循环判断执行 3.通过映射浏览器的request...
laya timer 回调 传参
frankxixu的专栏
02-21 318
Laya.timer.once(1000,this,function(){ clip.destroy(); },clip)
LayaBox中timer.once执行次数不正确问题的解决
Rajon_94的博客
10-23 1568
/** * 定时执行一次。 * @param   delay   延迟时间(单位为毫秒)。 * @param   caller  执行域(this)。 * @param   method  定时器回调函数。 * @param   args    回调参数。 * @param   coverBefore 是否覆盖之前的延迟执行，默认为 true 。 */ once(delay: nu...
layabox定时器
qq_34297991的博客
10-31 273
【代码】layabox定时执行一次。
《laya 性能优化》Laya 分帧加载优化
weixin_41640571的博客
12-08 1393
伪代码如下 curIdx: number = 0; st: number = 0; tLimit: number = 1000 / Laya.timer.currFrame * 0.25;// 处理事件不超过这一阵所需要事件的25% MAX_COUNT = 1000; // 处理事件的个数 public startFrameLoad() { Laya.timer.frameLoop(1, this, this.onFrame); }
Laya3.x版本,2D使用自定义shader
q641187432的专栏
07-07 1000
Value2D类是 LayaAir 图形渲染系统中着色器处理的核心类，它主要用于封装 WebGL 渲染相关的数据，以便在着色器程序中使用。这些数据包括顶点、纹理、颜色等信息。Value2D的实例会根据不同的需求传递给 GPU，用于控制图形渲染。在 LayaAir 的绘制系统中，有许多继承自Value2D的子类，如TextureSV等。这些子类用于处理不同类型的图形渲染任务，例如纹理渲染、基本图形渲染等。总之，Value2D是 LayaAir 游戏引擎中一个关键的基础类，用于处理图形渲染的各种参数和数据。
Laya1.8.4 UI长按选择对应位置释放技能
最新发布
weixin_50702814的博客
03-29 476
记录实践的知识点
任务21：Timer类的简介
m0_56811106的博客
09-26 145
文章目录一、任务目标二、任务分解2.1 callLater方法介绍2.2 其他函数介绍 一、任务目标 Timer是LayaAir提供的一个时间管理类，一般的延迟事件的触发等都需要借助该类。需要注意的是Timer是一个单例，不需要我们手动实例化，直接使用Laya.timer调用即可。 二、任务分解 2.1 callLater方法介绍 该方法官方的解释是延迟调用，很多小伙伴会误解，其实这里延迟调用的意思是callLater中传入的方法只触发一次，我们用for循环循环10次，其实只会触发一次，这是为了优化性能而引
callLater
weixin_30707875的博客
10-23 169
UIComponent的方法，该方法在每次更新屏幕之前，Flash Player 或 AIR 都会调用为更新预定的函数集。有时，应在下次更新时调用函数，以执行为当前更新预定的其余代码。部分功能（如效果）可能会延迟排队的函数，直到功能完成为止。该方法在数据更新完之后，下次刷新之前可以用来做一些处理。 转载于:https://www.cnblogs.com/piaobo/p/4905253.html...
Linux 定时器timer_list
07-12
Linux 定时器 timer_list 是一个内核数据结构，用于管理内核中的定时器。它是一个双向链表，每个节点表示一个定时器。timer_list 的定义位于 `<linux/timer.h>` 头文件中。 每个 timer_list 节点的定义如下： ```c struct timer_list { struct list_head entry; // 定时器节点的链表指针 unsigned long expires; // 定时器的到期时间 void (*function)(unsigned long); // 定时器回调函数 unsigned long data; // 传递给回调函数的参数 struct tvec_base *base; // 定时器所属的时间轮 int slack; // 定时器的松弛时间 }; ``` 其中，`entry` 是一个 `list_head` 结构，用于将节点连接到定时器链表中。`expires` 表示定时器的到期时间，以 jiffies 单位表示。`function` 是定时器的回调函数，在定时器到期时被调用。`data` 是传递给回调函数的参数。`base` 表示定时器所属的时间轮，`slack` 是定时器的松弛时间，用于处理定时器的精度。 在使用 timer_list 时，可以使用以下函数进行初始化和操作： - `timer_setup(struct timer_list *timer, void (*function)(unsigned long), unsigned int flags)`：初始化一个定时器，并指定回调函数和标志。 - `init_timer(struct timer_list *timer)`：初始化一个定时器。 - `add_timer(struct timer_list *timer)`：将定时器添加到定时器链表中。 - `del_timer(struct timer_list *timer)`：从定时器链表中删除定时器。 - `mod_timer(struct timer_list *timer, unsigned long expires)`：修改定时器的到期时间。 这些函数可以通过 `<linux/timer.h>` 头文件中的宏来调用。通过操作 timer_list，可以实现在 Linux 内核中的定时器功能。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

蚩尤后裔-汪茂雄

芝兰生于深林，不以无人而不芳。

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值