文档章节

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

han007
 han007
发布于 2017/01/13 17:43
字数 1017
阅读 145
收藏 0

这里简单说一句,由于我们白鹭开发是使用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();
    }
}

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

 

© 著作权归作者所有

han007
粉丝 6
博文 37
码字总数 18242
作品 0
海淀
程序员
私信 提问
怎样做一款赚钱的小游戏-2018 白鹭HTML5开发者巡回沙龙广州站

2018年,白鹭HTML5开发者巡回沙龙再次起航,我们将以“赢在小,胜在变”为主题,在广州、武汉、福州、杭州、上海、成都等城市举办“2018白鹭HTML5开发者巡回沙龙”。首站沙龙将于9月15日在广...

白鹭科技
2018/09/05
43
0
怎样做一款赚钱的小游戏-2018 白鹭HTML5开发者巡回沙龙广州站

2018年,白鹭HTML5开发者巡回沙龙再次起航,我们将以“赢在小,胜在变”为主题,在广州、武汉、福州、杭州、上海、成都等城市举办“2018白鹭HTML5开发者巡回沙龙”。首站沙龙将于9月15日在广...

白鹭科技
2018/09/05
130
0
小游戏·大市场·靠人才·巧入局-2018 白鹭HTML5开发者巡回沙龙武汉站

2018“赢在小,胜在变”白鹭HTML5开发者巡回沙龙已正式起航。9月15日,本年度巡回沙龙第一站在广州成功举办,演讲嘉宾们就“怎样做一款赚钱的小游戏”的主题进行了精彩的分享,沙龙现场参会人...

白鹭科技
2018/09/29
74
0
小游戏的技术发展与出海前景-2018 白鹭HTML5开发者巡回沙龙厦门站

2018“赢在小,胜在变”白鹭HTML5开发者巡回沙龙火热进行中。本年度巡回沙龙已成功举办广州、武汉两站,分别就“怎样做一款赚钱的小游戏”和“依靠人才入局H5小游戏市场”的主题进行了精彩的...

白鹭科技
2018/11/05
48
0
小游戏的技术发展与出海前景-2018 白鹭HTML5开发者巡回沙龙厦门站

2018“赢在小,胜在变”白鹭HTML5开发者巡回沙龙火热进行中。本年度巡回沙龙已成功举办广州、武汉两站,分别就“怎样做一款赚钱的小游戏”和“依靠人才入局H5小游戏市场”的主题进行了精彩的...

白鹭科技
2018/11/05
16
0

没有更多内容

加载失败,请刷新页面

加载更多

JS 打印控制

JS 打印控制 var PrintStartString = "<!--打印开始标示符-->";//设置打印开始区域var PrintEndString = "<!--打印结束标示符-->";//设置打印结束区域var HtmlText = window.do......

DrChenXX
6分钟前
5
0
LevelDB:使用介绍

LevelDB 提供的接口其实很简单,下面举例进行简单说明。 安装 git clone https://github.com/google/leveldb cd leveldb mkdir -p build && cd build cmake -DCMAKE_BUILD_TYPE=Release .. ......

slagga
11分钟前
5
0
《JavaScript正则表达式迷你书》读书笔记

正则基础 常见简写形式 字符组 具体含义 记忆方式 \d 表示 [0-9]。表示是一位数字。 其英文是 digit(数字) \D 表示 [^0-9]。表示除数字外的任意字符。 \w 表示 [0-9a-zA-Z_]。表示数字、大小...

muzi131313
16分钟前
2
0
Git的反悔操作

概述 这次主要来讲讲Git的反悔操作,自己平时在写代码的过程中经常会出现想要弃用所有的改动或回滚到上一次commit的情况。Git上的反悔操作有reset、rebase、revert等,每个操作各有区别和对应...

duduYZ
16分钟前
2
0
实现双向绑定Proxy比defineproperty优劣如何?

前言 双向绑定其实已经是一个老掉牙的问题了,只要涉及到MVVM框架就不得不谈的知识点,但它毕竟是Vue的三要素之一. Vue三要素 响应式: 例如如何监听数据变化,其中的实现方法就是我们提到的双向...

寻找海蓝
28分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部