Laya Event

事件Event指的是由系统事先设定的、能被对象识别和响应的动作，事件是指对象对于外部动作的响应，当对方发生了某个事件，就会执行于此事件对应的代码。

事件处理机制

事件处理机制

1. 将事件监听器注册到事件源
2. 外部动作触发事件源上的事件
3. 事件源生成事件对象
4. 触发事件监听器的事件被作为参数传入事件处理器
5. 事件监听器调用事件处理器做出响应

HTML与JavaScript交互式通过事件驱动实现的，比如鼠标点击事件、页面滚动事件等，事件是可以被JavaScript监测到的行为，页面中每个DOM元素都可以产生某些触发JavaScript程序的事件，同时都是通过向文档中的元素添加事件监听器来订阅事件。简单来说事件就是在什么时间里执行什么样的操作，JavaScript中通过一套事件来完成某项指定的功能。在DOM2事件流中对顶了事件流包含的三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段。

事件处理机制

事件包含三要素：事件源、事件类型、事件处理器（函数），三者之间的关系是：事件源 + 事件类型 = 执行指令。从开发者的角度来看，重点在获取事件源、绑定特定类型的事件、编写事件处理函数实现特定功能。

事件处理器（Event Handler）是异步（Asynchronous）执行、处理程序或事件中输入的回调函数

LayaAir引擎中的事件主要包含三部分

• Laya.Event 事件类型，事件接口，不同的事件类型都要实现此接口。
• Laya.EventDispatcher 事件分发，每个传递过来的事件都会由它分发给特定的处理者。
• Laya.Handler 事件处理，不同的处理器需是新该接口。

事件类型

Laya.Event是事件类型的集合，当事件发生时Laya.Event对象将作为参数传递给事件监听器。

事件类型	描述
Laya.Event.CLICK	单击
Laya.Event.MOUSE_DOWN	鼠标按下

Laya.Event.CLICK:string = "click"

CLICK静态属性用于定义事件对象的type类型属性值为单击事件

例如：点击按钮后获取其上标签后设置到指定标签的文本上

点击事件

class Test{
    constructor(){
        //初始化舞台
        this.initStage();
        //创建标签节点
        this.createLabel();
        //创建按钮节点
        this.createButton();
    }
    initStage(){
        //初始化引擎
        const canvas = Laya.init(Laya.Browser.clientWidth, Laya.Browser.clientHeight, Laya.WebGL);
        //舞台设置
        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";//设置舞台背景颜色为黑色
    }
    createLabel(){
        let label = new Laya.Label();
        label.text = "文本标签";
        label.fontSize = 20;
        label.color = "#fff";
        label.pos(
            (Laya.stage.width-label.width)>>1, 
            100
        );
        this.label = label;
        //向舞台添加标签节点
        Laya.stage.addChild(label);
    }
    createButton(){
        //加载资源后创建按钮节点
        Laya.loader.load(
            "res/atlas/comp.atlas", 
            Laya.Handler.create(this, this.initButton)
        );
    }
    initButton(event){
        let btn = new Laya.Button("comp/button.png");
        btn.label = "测试按钮";
        btn.labelSize = 20;
        btn.labelColors = "#fff";
        btn.width = 150;
        btn.height = 40;
        btn.pos(
            (Laya.stage.width - btn.width)>>1, 
            (Laya.stage.height - btn.height)>>1
        );
        //向舞台中添加按钮节点
        Laya.stage.addChild(btn);
        //将舞台缓存为静态图像
        Laya.stage.cacheAs = "normal";
        //为按钮注册单击事件
        btn.on(Laya.Event.CLICK, this, this.onClickButton, [btn]);  
    }
    //按钮点击事件
    onClickButton(btn){
        this.label.text = btn.label;
        this.label.fontSize = 24;
        this.label.bold = true;
        this.label.color = "yellow";
    }
}
new Test();

static Laya.Event.MOUSE_DOWN:string = "mouse_down"

Laya.Event事件类型类中的MOUSE_DOWN静态属性定义了事件对象的type类型属性值为鼠标按下事件。

例如：在矩形区域内部与外边缘拖放标签文本

鼠标按下

class Test{
    constructor(){
        //初始化舞台
        this.initStage();
        //创建标签节点
        this.createLabel();
        //创建矩形节点
        this.createRect();
    }
    initStage(){
        //初始化引擎
        const canvas = Laya.init(Laya.Browser.clientWidth, Laya.Browser.clientHeight, Laya.WebGL);
        //舞台设置
        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";//设置舞台背景颜色为黑色
    }
    createLabel(){
        let label = new Laya.Label();
        label.text = "标签";
        label.fontSize = 20;
        label.color = "#fff";
        label.pos(300, 120);
        Laya.stage.addChild(label);

        label.on(
            Laya.Event.MOUSE_DOWN,
            this,
            this.onLabelMouseDown
        );
        this.label = label;
    }
    onLabelMouseDown(event){
        this.label.startDrag(this.rect, true, 30, 100);
    }
    createRect(){
        const width = Laya.stage.width/3;
        const height = Laya.stage.height/3;
        const x = (Laya.stage.width - width)>>1;
        const y = (Laya.stage.height - height)>>1;

        let rect = new Laya.Rectangle();
        rect.x = x;
        rect.y = y;
        rect.width = width;
        rect.height = height;
        this.rect = rect;

        let sprite = new Laya.Sprite();
        sprite.graphics.drawRect(x, y, width, height, null, "#fff");

        Laya.stage.addChild(sprite);
    }
}
new Test();

事件分发

事件分发（EventDispatcher）模式是监听模式的一种扩展，由事件驱动，每当有事件产生的时候，由事件分发器（EventDispatcher）分发给特定的事件处理器（EventHandler）处理该事件。EventDispatcher表示事件发送者、事件捕获传递与分发。

Laya.EventDispatcher 事件分发器是可调度事件类的基类，比如作为基础节点的Node类继承自EventDispatcher类，只要继承此类就可以作为一个事件发送者发送事件给它的监听者。

方法	描述
hasListener()	用于判断事件分发器对象是否为特定类型的事件注册了监听器
isMouseEvent()	用于判断特定类型的事件是否为鼠标事件
event()	用于派发事件
off()	用于从事件分发器对象中删除监听器
offAll()	用于从事件分发器对象中删除指定事件类型的所有监听器
on()	用于向事件分发器注册指定类型的事件监听器
once()	用于向事件分发器注册指定类型的事件监听器

EventDispatcher.hasListener(type:String):Boolean

hasListener()方法用于判断事件分发器对象是否为特定类型的事件注册了监听器

EventDispather.isMouseEvent(type:string):Boolean

isMouseEvent()方法用于判断特定类型的事件是否为鼠标事件

EventDispatcher.event(type:string, data:*=null):Boolean

event()方法用于派发事件

EventDispatcher.off(type:String, caller:*, listener:Function, onceOnly:Boolean=false):EventDispather

off()方法用于从事件分发器对象中删除监听器

EventDispatcher.offAll(type:String = null):EventDispatcher

offAll()方法用于从事件分发器对象中删除指定事件类型的所有监听器

EventDispatcher.on(type:String, caller:*, listener:Function, args:Array=nulll):EventDispatcher

on()方法用于向事件分发器注册指定类型的事件监听器，使事件监听器能够接收事件通知。

EventDispatcher.once(type:String, caller:*, listener:Function, args:Array=null):EventDispatcher

once()方法用于向事件分发器注册指定类型的事件监听器，使事件监听器能够接收事件通知，事件监听器响应一次后会自动移除。

例如：对Laya.EventDispatcher事件分发器的封装

TS版本

/**
 * 全局事件管理器
 * 单例模式
 */
export default class EventManager{
    /**事件分发器对象 */
    private _dispather:Laya.EventDispatcher;
    /**单例模式 */
    private static _instance:EventManager;
    constructor(){
        //初始化事件分发器对象
        this._dispather = new Laya.EventDispatcher();
    }
    static get instance():EventManager{
        if(!this._instance){
            this._instance = new EventManager();
        }
        return this._instance;
    }
    /**添加事件监听 */
    on(type:string, listener:Function, caller:any, args:Array<any>=null):void{
        this._dispather.on(type, caller, listener, args);
    }
    /**关闭事件监听 */
    off(type:string, listener:Function, caller:any, onceOnly:boolean=false):void{
        this._dispather.off(type, caller, listener, onceOnly);
    }
    /**执行一次后自动移除监听 */
    once(type:string, listener:Function, caller:any, args:Array<any>=null):void{
        this._dispather.once(type, caller, listener, args);
    }
    /**分发事件/抛出事件 */
    dispatch(type:string, data:any=null):boolean{
        return this._dispather.event(type, data);
    }
}

ES版本

/**事件管理器 */
export default class EventManager{
    /**单例模式 */
    static getInstance(...args){
        if(!this._instance){
            this._instance = new EventManager(...args);
        }
        return this._instance;
    }
    constructor(){
        this._dispatcher = new Laya.EventDispatcher();
    }
    /**是否具有指定类型的监听器 */
    has(type){
        return this._dispatcher.hasListener(type);
    }
    /**派发/抛出事件 */
    event(type, data){
        return this._dispatcher.event(type, data);
    }
    dispatch(type, data){
        return this._dispatcher.event(type, data);
    }
    /**监听事件 */
    on(type, caller, listener, args){
        this._dispatcher.on(type, caller, listener, args);
    }
    /**取消事件监听 */
    off(type, caller, listener, onceOnly=false){
        this._dispatcher.off(type, caller, listener, onceOnly);
    }
    /**移除对象上指定类型的所有监听器 */
    remove(type){
        this._dispatcher.offAll(type);
    }
    /**执行一次就自动移除的监听 */
    once(type, caller, listener, args){
        this._dispatcher.once(type, caller, listener, args);
    }
}

事件处理

项目	描述
Package	laya.utils
Class	public class Handler
Inheritance	Handler / Object

方法	描述
clear(): Handler	清理对象引用
recover(): void	清理并回收到 Handler 对象池内
run(): any	执行处理器
runWith(data: any): any	执行处理器，并携带额外数据。
setTo()	设置此对象的指定属性值
create()	从对象池内创建一个Handler

Laya.Handler 事件处理器，推荐使用Laya.Handler.create()方法从对象池创建，以减少对象创建消耗。当创建的Handler对象不再使用后，可使用Laya.Handler.recover()将其回收到对象池，回收后不要再使用此对象，否则会导致不可预料的错误。需要注意的是，由于鼠标事件也使用了对象池，不正确的回收以及调用，可能会影响事件的执行。

static create(caller:any, method:Function|null, args?:any[]|null, once?:boolean):Handler
// 使用方式
Laya.Handler.create()

create()方法用于从对象池内创建一个处理器（Handler），默认会执行一次并立即回收，如果无需自动回收，则需设置参数once为false。

参数	作用
caller:any	执行域this
method:Function	回调方法
Default value args:any[]	携带的参数
Default value once:bool	是否只执行一次，为true回调后会执行recover()进行回收，默认为true。

recover():void

recover()方法用于将处理器（Handler）清理并回收到处理器对象池内

run():void

run()方法用于执行处理器（Handler）

runWith(data:any):any

runWith()方法用于执行处理器（Handler）并携带额外数据

参数	含义
data:any	附加的回调数据，可以是单个数据或多个数据的数组。