白鹭开发-测试专注力小游戏(下)

这里简单说一句，由于我们白鹭开发是使用typescript，如果你没有下载wing3而是用的webstorm的话，请去typescript中文网，下载一下，搭建下环境，以免游戏无法运行。

长话短说咱们接着看代码，我们项目已经创建好了，我们来到Main文件夹，我们能够看到很多代码

class Main extends egret.DisplayObjectContainer {

    /**
     * 加载进度界面
     * Process interface loading
     */
    private loadingView:LoadingUI;

    public constructor() {
        super();
        this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
    }

    private onAddToStage(event:egret.Event) {
        //设置加载进度界面
        //Config to load process interface
        this.loadingView = new LoadingUI();
        this.stage.addChild(this.loadingView);

        //初始化Resource资源加载库
        //initiate Resource loading library
        RES.addEventListener(RES.ResourceEvent.CONFIG_COMPLETE, this.onConfigComplete, this);
        RES.loadConfig("resource/default.res.json", "resource/");
    }

    /**
     * 配置文件加载完成,开始预加载preload资源组。
     * configuration file loading is completed, start to pre-load the preload resource group
     */
    private onConfigComplete(event:RES.ResourceEvent):void {
        RES.removeEventListener(RES.ResourceEvent.CONFIG_COMPLETE, this.onConfigComplete, this);
        RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onResourceLoadComplete, this);
        RES.addEventListener(RES.ResourceEvent.GROUP_LOAD_ERROR, this.onResourceLoadError, this);
        RES.addEventListener(RES.ResourceEvent.GROUP_PROGRESS, this.onResourceProgress, this);
        RES.addEventListener(RES.ResourceEvent.ITEM_LOAD_ERROR, this.onItemLoadError, this);
        RES.loadGroup("preload");
    }

    /**
     * preload资源组加载完成
     * Preload resource group is loaded
     */
    private onResourceLoadComplete(event:RES.ResourceEvent):void {
        if (event.groupName == "preload") {
            this.stage.removeChild(this.loadingView);
            RES.removeEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onResourceLoadComplete, this);
            RES.removeEventListener(RES.ResourceEvent.GROUP_LOAD_ERROR, this.onResourceLoadError, this);
            RES.removeEventListener(RES.ResourceEvent.GROUP_PROGRESS, this.onResourceProgress, this);
            RES.removeEventListener(RES.ResourceEvent.ITEM_LOAD_ERROR, this.onItemLoadError, this);
            this.createGameScene();
        }
    }

    /**
     * 资源组加载出错
     *  The resource group loading failed
     */
    private onItemLoadError(event:RES.ResourceEvent):void {
        console.warn("Url:" + event.resItem.url + " has failed to load");
    }

    /**
     * 资源组加载出错
     *  The resource group loading failed
     */
    private onResourceLoadError(event:RES.ResourceEvent):void {
        //TODO
        console.warn("Group:" + event.groupName + " has failed to load");
        //忽略加载失败的项目
        //Ignore the loading failed projects
        this.onResourceLoadComplete(event);
    }

    /**
     * preload资源组加载进度
     * Loading process of preload resource group
     */
    private onResourceProgress(event:RES.ResourceEvent):void {
        if (event.groupName == "preload") {
            this.loadingView.setProgress(event.itemsLoaded, event.itemsTotal);
        }
    }

    private textfield:egret.TextField;

    /**
     * 创建游戏场景
     * Create a game scene
     */
    private createGameScene():void {
       this.addChild(new GeekMain());
    }
}

你会问，为啥你这个    private createGameScene():void {
this.addChild(new GeekMain());
}下面没有代码了？ 我会说，你傻啊 我当然是删了啊！不然你以为哦~，我们先把下面的多余代码都删除，加上这段代码

this.addChild(new GeekMain());

创建场景后添加一个新场景，即我们的geekMain文件，接下来我们创建一个GeekMain.ts文件，

class GeekMain extends egret.DisplayObjectContainer {
	public constructor() {
		super();
		this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
	}

GeekMain继承自我们白鹭的对象， 跟上

public constructor()  //公共方法，外部可以访问，自动执行

{

this.addEventListener( egret.Event.ADDED_TO_STAGE,this.onAddToStage,this);

//监听将函数onAddToStage放置在舞台上

}

private spr: egret.Sprite;
    private timer: egret.Timer;
	private onAddToStage(event: egret.Event) {
		this.spr = new egret.Sprite();
		this.addChild(this.spr);
		this.spr.width = 480;
		this.spr.height = 800;
		this.drawTxt();//文本格式
		this.drawContent();//文本内容
		this.onButtonComp();//开始按钮图片
		//this.onButtonApm();//从玩按钮图片

接下来处理资源组与定时器

RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onButtonComp, this);
		RES.loadConfig("resource/assets/mybtn.png");
		RES.loadGroup("mybtn_png");
		//确认按钮资源预加载

		RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onTouchSRP, this);
		RES.loadConfig("resource/assets/congzai.png");
		RES.loadGroup("congzai_png");
		//再玩一次预加载

		this.timer = new egret.Timer(1000，8);
		this.timer.addEventListener(egret.TimerEvent.TIMER, this.timerFunc, this);//开始计时执行
		this.timer.addEventListener(egret.TimerEvent.TIMER_COMPLETE, this.timerComFunc, this);//计时结束执行

｝

绘制内容

private drawContent(): void {
		this.con = new egret.TextField();
		this.con.text = "默默倒数6秒，迅速点击文字"；
	 this.con.textColor = 0x00ff00;
	 this.con.width = 630;
	 this.con.textAlign = egret.HorizontalAlign.CENTER;
	 this.con.y = 120;
	 this.spr.addChild(this.con);
   }

 //图片组
   private img: egret.Bitmap;
   private resetImg: egret.Bitmap;
   //计时组
   private startTime:number;
   private stopTime:number;
   private finalTimer:number;

   private onButtonComp():void
   {
     this.img = new egret.Bitmap();
	 this.img.texture = RES.getRes("mybtn_png");
     var rect: egret.Rectangle = new egret.Rectangle( 10,10,15,15 );//初始坐标位置
	 this.img.scale9Grid = rect;
	 this.img.y = 200;
	 this.img.x = 230;
	 this.img.width += 5;
	 this.height = 70;
	 this.spr.addChild( this.img );
	 this.img.touchEnabled = true;
	 this.img.addEventListener(egret.TouchEvent.TOUCH_TAP,this.onTouch,this);
   }
   private onTouch(evt: egret.TouchEvent)
   {
	   this.date = new Date();
	   this.startTime = this.date.getTime();

     this.img.alpha = 0;
	 this.timer.start();
	 this.drawTxt();
	 this.spr.touchEnabled = true;
	 this.spr.addEventListener( egret.TouchEvent.TOUCH_TAP,this.onTouchSRP,this,true);

   }
   private timerFunc()
   {
     if(this.n <= 3)
	 {
      this.num.text = "?";
	 }else{
		 this.spr.removeChildren();//移除对象防止叠加
		 this.drawTxt();
	 }
	 this.n--;
   }
   private timerComFunc()
   {
     if( this.n <= -2)
	 {
         this.drawContent();
		 this.con.text = "别模糊了赶紧醒醒!";
		 this.removeEventListener( egret.TouchEvent.TOUCH_TAP,this.onTouchSRP,this,true);
	 }

   }
   private onTouchSRP(evt:egret.TouchEvent)
   {
    this.date = new Date();//截取时间差,点击屏幕时间
	this.stopTime = this.date.getTime();
	this.finalTimer = this.startTime - this.stopTime;//最终时间
	this.num.text =(this.finalTimer/1000 + 6).toFixed(3) ;//取最后小数点后3位 ,因为只有number类型
	this.timer.stop();
	this.drawContent();
	this.removeEventListener( egret.TouchEvent.TOUCH_TAP,this.onTouchSRP,this,true);
	this.spr.touchEnabled = false;

	   this.resetImg = new egret.Bitmap();
	   this.resetImg.texture = RES.getRes("congzai_png");
	   var ract: egret.Rectangle = new egret.Rectangle( 30,30,15,15 );
	   this.resetImg.scale9Grid = ract;
	   this.resetImg.y = 400;
	   this.resetImg.x = 500;
	   this.resetImg.width += 4;
	   this.height = 50;
	   this.resetImg.touchEnabled = true;
	   this.spr.addChild( this.resetImg ); 
	   this.resetImg.addEventListener( egret.TouchEvent.TOUCH_TAP,this.onclickBtn,this);

开始switch

switch(Math.floor(Math.abs(this.finalTimer/1000 + 6 )))
	{
      case 0:
	  this.con.text = "你真棒！打败了全国百分之99的玩家。"
	  break;

      case 1:
	  this.con.text = "很专注,还需要继续努力哦！"
	  break;

	  case 2:
	  this.con.text = "别模糊了，醒醒！"
	  break;
	}
  }
  	private onclickBtn(event: egret.TouchEvent)
	{
        this.spr.removeChildren();
		this.removeEventListener( egret.TouchEvent.TOUCH_TAP,this.onTouchSRP,this,true);
		//alert(123);
		window.location.reload();
    }
}

。。。今天又是代码满满的一天，老哥们我们下期见