egret入门教程
定义一个主场景
1class Main extends egret.DisplayObjectContainer初始化构造器
1234public constructor() {super();this.once( egret.Event.ADDED_TO_STAGE, this.onAddToStage, this );}
ADDED_TO_STAGE事件触发onAddToStage函数
- 加载一个图片资源12345private onAddToStage(event:egret.Event){var imgLoader:egret.ImageLoader = new egret.ImageLoader;imgLoader.once( egret.Event.COMPLETE, this.imgLoadHandler, this );imgLoader.load( "resource/cartoon-egret_00.png" );}
图片加载完又一个imgLoadHandler
- 添加物体到主视图1234private imgLoadHandler( evt:egret.Event ):void {this._bird = new egret.Bitmap( evt.currentTarget.data );this.addChild( this._bird );}
通过evt.currentTarget.data获取图片资源信息
为舞台添加触碰事件
1this.stage.addEventListener( egret.TouchEvent.TOUCH_BEGIN, this.touchHandler, this );touch事件监测
12345678910111213141516171819202122232425private touchHandler(evt:egret.Event){//通过evt.type判断事件类型switch ( evt.type ){case egret.TouchEvent.TOUCH_MOVE:this.checkCollision( evt.stageX, evt.stageY );break;case egret.TouchEvent.TOUCH_BEGIN:// 可以直接调用hitTestPoint方法来检测是否碰到_txInfo区域if( !this._txInfo.hitTestPoint( evt.stageX, evt.stageY ) ){this.stage.addEventListener( egret.TouchEvent.TOUCH_MOVE, this.touchHandler, this );this.stage.once( egret.TouchEvent.TOUCH_END, this.touchHandler, this );this.addChild( this._dot );this.checkCollision( evt.stageX, evt.stageY );}break;case egret. TouchEvent.TOUCH_END:this.stage.removeEventListener( egret.TouchEvent.TOUCH_MOVE, this.touchHandler, this );this.stage.addEventListener( egret.TouchEvent.TOUCH_BEGIN, this.touchHandler, this );if( this._dot.parent ){this._dot.parent.removeChild( this._dot );}this.updateInfo( TouchCollideStatus.NO_TOUCHED );break;}}
注意在begin事件里面对于TOUCH_END用的是once 而移动过程中会不断去检测
- 最后看下这个函数可以和原声js对比一下12345this._txInfo.addEventListener( egret.TouchEvent.TOUCH_TAP, ( evt:egret.TouchEvent )=>{evt.stopImmediatePropagation();this._bShapeTest = ! this._bShapeTest;this.updateInfo( TouchCollideStatus.NO_TOUCHED );}, this );
这里用到了stopImmediatePropagation阻止事件冒泡 因为之前在舞台中绑定了touch
这是egret第一讲 有兴趣的同学可以看这里