创建类
class MyScene extends egret.Sprite {
public constructor() {
super();
MyScene.SEX = "男";
this.addEventListener(egret.Event.ADDED_TO_STAGE,function(){
// 当当前容器添加到舞台后再执行
},this)
}
public name;//公开属性
private age;//私有属性，不允许在实例化对象中调用，只可以在myScene类的内部使用
}
封装的方法
//绘制图片容器
function createImg(imgName){
let myImg = new egret.Bitmap();
myImg.texture = RES.getRes(imgName);
return myImg;
}
、、绘制文本域
function createText(text,size=30,color=0x000000,textAlign="center",verticalAlign="MIDDLE"){
let myText = new egret.TextField();
myText.text = text;
myText.size = size;
myText.textColor = color;
myText.textAlign = textAlign;
myText.verticalAlign = verticalAlign;
return myText;
}
//绘制矩形
function createRect(width:number,height:number,bgColor=0x000000,alpha=1,lineWidth=0,lineColor=0x000000){
let myRect = new egret.Shape();
myRect.graphics.beginFill(bgColor,alpha);
myRect.graphics.lineStyle(lineWidth,lineColor);
myRect.graphics.drawRect(0,0,width,height);
myRect.graphics.endFill();
return myRect;
}
//绘制按钮
function createBtn(text,width,height,callback=function(){},bgColor=0xffff00,hoverBgColor=0xff4500,textSize=60,textColor=0xffffff,hoverTextColor=0x234567){
let myBtn = new egret.Sprite();
// 按钮里面的文字
let myText = new egret.TextField();
myText.text = text;
myText.width = width;
myText.height = height;
myText.textAlign = egret.HorizontalAlign.CENTER;
myText.verticalAlign = egret.VerticalAlign.MIDDLE;
myText.textColor = textColor;
myText.size = textSize;
// 绘制按钮的矩形
myBtn.graphics.beginFill(bgColor);
myBtn.graphics.drawRect(0,0,width,height);
myBtn.graphics.endFill();
myBtn.addChild(myText);
// 添加点击事件
myBtn.touchEnabled = true;
myBtn.addEventListener(egret.TouchEvent.TOUCH_BEGIN,function(){
myBtn.graphics.clear();
myBtn.graphics.beginFill(hoverBgColor);
myBtn.graphics.drawRect(0,0,width,height);
myBtn.graphics.endFill();
myText.textColor = hoverTextColor;
},null)
// 执行按钮的点击事件
myBtn.addEventListener(egret.TouchEvent.TOUCH_END,function(){
myBtn.graphics.clear();
myBtn.graphics.beginFill(bgColor);
myBtn.graphics.drawRect(0,0,width,height);
myBtn.graphics.endFill();
myText.textColor = textColor;
callback();
},null)
return myBtn;
}
// 绘制一个圆角矩形
function createRoundRect(width:number,height:number,eclipW,eclipH){
let myRoundRect = new egret.Shape();
myRoundRect.graphics.lineStyle(8,0xffff00);
myRoundRect.graphics.drawRoundRect(0,0,width,height,eclipW,eclipH);
return myRoundRect;
}
自定义进度条事例
//进度条部分
class progressBar extends egret.Sprite{
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE,function(){
this.pW = this.stage.stageWidth*.8;
this.drawBorder();
},this);
}
public pW:number;
public pH:number = 40;
// 画出边框
public drawBorder(){
this.graphics.clear();
this.graphics.beginFill(0xffffff,0);
this.graphics.lineStyle(4,0x00ff00);
this.graphics.drawRoundRect(0,0,this.pW,this.pH,10,10);
this.graphics.endFill();
this.anchorOffsetX = this.pW*.5;
this.anchorOffsetY = this.pH*.5;
}
private bgR:egret.Shape = new egret.Shape();
// 画出进度条
public drawBg(width){
width = width>=this.pW-4?this.pW-4:width;
this.bgR.graphics.clear();
this.bgR.graphics.beginFill(0xeb6616);
this.bgR.graphics.drawRect(2,2,width,this.pH-4);
this.bgR.graphics.endFill();
this.addChild(this.bgR);
}
}
//LoadingUI
class LoadingUI extends egret.Sprite implements RES.PromiseTaskReporter {
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE,function(){
this.proB = new progressBar();
this.proB.x = this.stage.stageWidth*.5;
this.proB.y = this.stage.stageHeight*.5;
this.addChild(this.proB);
},this)
}
private proB:progressBar;
public onProgress(current: number, total: number): void {
let curW:number = this.proB.pW*current/total;
this.proB.drawBg(curW);
}
}
加载资源的方法
//同步获取资源，这种方式只能获取缓存过的资源
RES.getRES(name:string)
//异步获取资源,这种方式可以获取配置中的所有资源项。如果缓存中存在则直接调用回调函数
RES.getRESAsync(name:string,compFunc:function,thisObject)
//通过url获取不在配置中的资源，通常不建议使用这个接口，只在获取其他服务器的资源时使用
RES.getResByUrl(url:string,compFunc:function,thisObject,type:string = "")
加载资源组
private async loadResource(){//加载资源组
//实例化进度条
let loadingView = new LoadingUI();
this.addChild(loadingView);
//加载资源组，第一个参数为资源组名称，第二个参数为优先级，第三个参数为loadingUI
await RES.loadGroup("player",0,loadingView);
//加载完成后移除进度条
this.removeChild(loadingView);
this.createGameScene();
}
播放音乐
//获取音乐sound对象
let sound = RES.getRes("music");
//通过sound.play创建soundChannel对象，用来控制声音播放
soundC = sound.play();
计时器的使用
Timer
//第一个参数为播放的间隔时间，第二个参数为执行次数，若为0则重复执行
let timer = new egret.Timer(100,1);
//每次到达间隔时间时调用
timer.addEventListener(egret.TimerEvent.TIMER,function(){
console.log("timer");
},this);
//当计时器到达重复次数后调用
timer.addEventListener(egret.TimerEvent.TIMER_COMPLETE,function(){
console.log("timer执行完毕");
},this)
ticker
//startTick全局函数将以 60 帧速率回调函数
private function tickerC(){
console.log("我是ticker");
return false;
}
//第一个参数为回调函数，第二个参数为this的指向
egret.startTick(this.tickerC,this);
egret.stopTick(this.tickerC,this);
帧事件
//帧事件的回调与帧率的相同
this.addEventListener(egret.Event.ENTER_FRAME,function(){
console.log("我是帧事件");
},this)
场景管理类事例
class SceneManager {
//通过单例模式生产管理类
static obj:SceneManager;
static createObj(_stage){
if(!SceneManager.obj){
SceneManager.obj = new SceneManager(_stage);
}
return SceneManager.obj;
}
/*
1、能够帮我们快速加载资源
2、能够帮我们快速切换场景
*/
public constructor(_stage) {
this._stage = _stage;
}
private _stage;
private curScene;
public async loadScene(sceneName,NextScene){
// 功能一：加载资源
let loadingView = new LoadingUI();
this._stage.addChild(loadingView);
await RES.loadGroup(sceneName,0,loadingView);
this._stage.removeChild(loadingView);
// 功能二：切换场景
let nextScene = new NextScene();
this._stage.addChild(nextScene);
nextScene.x = this._stage.stage.stageWidth;
egret.Tween.get(nextScene).to({x:0},400,egret.Ease.backInOut).call(()=>{
if(this.curScene && this._stage.contains(this.curScene)){
this._stage.removeChild(this.curScene);
}
this.curScene = nextScene
})
}
}
// 调用场景管理类来加载场景
SceneManager.createObj(this.stage).loadScene("welcome",welcome);
创建帧动画
//第一步：实例化一个movieClipData的工厂
//第一个参数为MovieClip数据集，该数据集必须由Egret官方工具生成，第二个参数为纹理
let mcDataFactory = new egret.MovieClipDataFactory(RES.getRes("default_json"),RES.getRes("default_png"));
// 第二步：通过mcDataFactory得到movieClipData，接收一个动作参数，由json文件获取到
let mcData = mcDataFactory.generateMovieClipData("move");
// 第三步：实例化出来一个movieClip
let mc = new egret.MovieClip(mcData);
this.addChild(mc);
// 第四步，播放mc动画
//可传入number,<1为无限播放，大于1则指定播放次数
mc.play(-1);
//跳到指定帧播放
mc.gotoAndPlay("move2",-1);
