终于到终篇了~~~ 这是laya第一篇分享文章
很感谢laya提供的平台和引擎以及工具方便我们来开发自己想做的东西
关键是方便啊~~~ 希望laya越来越来 ~~~~

PS:可能太仓促有许多地方表述的不是很到位朋友们多多谅解和包涵~~~~

废话不多说迈入正题~~
从前面几节分析下来我们还有哪些功能没有实现？这里列出来
1、能量条
2、道具
3、玩家特效
4、随机NPC
5、游戏介绍
6、游戏结束
7、优化

好像没记错的话就上面这些东东了吧~~~
好摩擦摩擦双手开始搞起来
我们先把要用到的资源放到res目录

红框是我们这次新增的资源
嗯有了新资源我们第一步要干嘛啊？
对先把这些资源预加载~~~ 我们打开LayaSample.js 把新的资源放到预加载列表中

======================== 能量条 ========================
先讲能量条
我们游戏中有两种能量条
1、玩家悬空能量
2、玩家加速能量
根据我们的UI来分析一下其实两个能量条都是一样的只是颜色不一样
那我们可以只写一个HP.js 来实现两个能量条的功能，我们创建一个Hp.js
代码如下

(function () {
	
    
    /**
     * 血条
     * 
     */
	function Hp(type){
        //背景
        this.bg = null;
        //进度条
        this.bar = null;
        //最小值
        this.MIN_VALUE = 0;
        //最大值
        this.MAX_VALUE = 100;

        //值
        this.value = 100;

	    Hp.__super.call(this);

		this.init(type);
	}
    //能量类型
    Hp.HP_TYPE_ENERGY = "hp_type_energy";
    //速度类型
    Hp.HP_TYPE_SPEED = "hp_type_speed";

	//Hp
	Laya.class(Hp,"Hp", laya.display.Sprite);
	
	var _proto = Hp.prototype;
	
	_proto.init = function(type){

        this.width = 180;
        this.height = 21;

        var texture1 = Laya.loader.getRes("res/hp_bg.png");
        var texture2;
        switch (type) {
            case Hp.HP_TYPE_ENERGY:
                texture2 = Laya.loader.getRes("res/en_bar.png");
                break;
            case Hp.HP_TYPE_SPEED:
                texture2 = Laya.loader.getRes("res/hp_bar.png");
                break;
        }

        this.bg = new Sprite();
        this.bar = new Sprite();
        this.bar.x = 15;
        this.bar.y = 2;

        this.bg.graphics.drawTexture(texture1, 0, 0, 180, 21);
        this.bar.graphics.drawTexture(texture2, 0, 0, 155, 12);

        this.addChild(this.bg);
        this.addChild(this.bar);
	}

    /**
     * 修改当前状态
     */
    _proto.changeValue = function(value){
        this.value += value;
        if(this.value < this.MIN_VALUE){
            this.value = this.MIN_VALUE;
        }else if(this.value > this.MAX_VALUE){
            this.value = this.MAX_VALUE;
        }
        this.bar.scale(this.value / this.MAX_VALUE, 1);
    }
})();

这里我们通过初始化的type来区分是悬空能量条还是加速能量条
这里我们提供一个外部的方法 changeValue 来让外部控制能量条的进度

我们把能量条都添加到舞台上面吧~~ 打开runGame.js

(function () {
	/**
	 * 游戏入口
	 */
	function RunGame(){

		this.bg = null;
		this.mapFloor = null;
		this.player = null;

		this.flyEnergy = null;
		this.speedEnergy = null;

		RunGame.__super.call(this);
		this.init();
	}
	//RunGame 是一个显示对象 继承此 Sprite
	Laya.class(RunGame,"RunGame", laya.display.Sprite);
	
	//定义RunGame的prototype
	var _proto = RunGame.prototype;
	
	//初始化
	_proto.init = function(){
		console.log('RunGame Init');

		//背景
		this.bg = new Background();
		this.addChild(this.bg);
		//地板
		this.mapFloor = new MapFloor();
		this.addChild(this.mapFloor);
		
		//飞行能量条
		this.flyEnergy = new Hp(Hp.HP_TYPE_ENERGY);
		this.flyEnergy.y = 7;
		this.addChild(this.flyEnergy);
		
		//速度能量条
		this.speedEnergy = new Hp(Hp.HP_TYPE_SPEED);
		this.speedEnergy.y = 7;
		this.speedEnergy.x = this.flyEnergy.width + 10;
		this.addChild(this.speedEnergy);
		
		//玩家
		this.player = new Player();
		this.player.x = 32 * 8;
		this.player.y = 32 * 4;
		this.addChild(this.player);
		//监听 按下 弹起 事件
		Laya.stage.on(laya.events.Event.MOUSE_DOWN, this, this.onMouseDown);
		Laya.stage.on(laya.events.Event.MOUSE_UP, this, this.onMouseUp);

        //创建一个帧循环处理函数
        Laya.timer.frameLoop(1, this, this.onLoop);
	}
	_proto.onLoop = function(){
		// 检测人物是否踩在地板上面了
		for(var i = this.mapFloor.numChildren - 1; i > -1; i--){
			var floor = this.mapFloor.getChildAt(i);
			//检测人物是否踩在地板上面了
			if(floor.checkHit(this.player.x, this.player.y)){
				//人物如果踩到地板了 就把人物的坐标设置到地板上面
				this.player.y = floor.y;
				//如果到地板上面的 就得重置跳的方法
				this.player.jumpReset();
			}
		}
	}
	//点击 出发人物 跳跃
	_proto.onMouseDown = function(){
		this.player.jump();
	}
	_proto.onMouseUp = function(){
		this.player.gotoJump();
	}
})();

友情提醒每次增加了新的模块我们要做什么？
对。我们要在index.html里面引入这个模块js文件否则会报错哦
好我们刷新页面看看效果

======================== 道具 ========================
接下来我们来讲讲道具
道具我们有那几种？
1、普通积分道具

2、加速道具

3、悬空能量道具

同样我们新建一个Item.js

(function(){
    
    /**
     * 物品类
     */
    function Item(){

        //图标
        this.icon = null;
        //星星贴图
        this.starTexture = null;
        //加速贴图
        this.speedTexture = null;
        //悬空贴图
        this.flyTexture = null;

        this.type = "";

        Item.__super.call(this);
    }
    //类型分类
    //星星
    Item.ITEM_TYPE_STAR = "item_type_star";
    //加速
    Item.ITEM_TYPE_SPEED = "item_type_speed";
    //悬空
    Item.ITEM_TYPE_FLY = "item_type_fly";
    
	//Item
	Laya.class(Item,"Item", laya.display.Sprite);
    
    var _proto = Item.prototype;
    
    _proto.init = function(type){
        this.type = type;
        if(this.icon == null){
            this.starTexture = Laya.loader.getRes("res/item_1.png");
            this.speedTexture = Laya.loader.getRes("res/item_3.png");
            this.flyTexture = Laya.loader.getRes("res/item_4.png");
            this.icon = new Sprite();            
	        this.addChild(this.icon);
        }
        this.icon.graphics.clear();
        switch (type) {
            case Item.ITEM_TYPE_STAR:
                this.icon.graphics.drawTexture(this.starTexture, 0, 0, 32, 32);
                break;
            case Item.ITEM_TYPE_SPEED:
                this.icon.graphics.drawTexture(this.speedTexture, 0, 0, 40, 53);
                break;
            case Item.ITEM_TYPE_FLY:
                this.icon.graphics.drawTexture(this.flyTexture, 0, 0, 40, 48);
                break;
            default:
                break;
        }
    }
})();

看代码我们发现依旧是将三种不同的图片默认初始化好然后我们通过初始化的type来区分不同的物品
物品有了我们得把他们放到地板上面
首先我们来简单理顺一下思路
1、地板上面出现最多的是星星
2、所有物品在地板上面需要居中显示
3、物品需要有碰撞检测
上一节我们有讲到 Floor 这个类的作用它主要就是一个块地板
而游戏刚开始的时候我们会创建一个普通地板宽度是素材的正常宽度那我们第一次进入游戏的时候的第一块地板我们就不添加道具了也就是说我们在随机宽度的地板上面才添加道具
还记得前面我们讲Floor是怎么生成的吗？每次移除屏幕外面我们都会创建一个新的Floor对象如果游戏玩久了可能就会很卡造成对象太多
其实我想一想跑出屏幕外面的地板是不是可以重复利用？
答案是肯定可以得~~

Laya为我们考虑到了这一点，就是大名鼎鼎的对象池
我们看看API

我们打开MapFloor.js 改造一下

接下来我们打开Floor.js 修改一下代码把道具添加出来

(function(){
    
    /**
     * 地板类
     */
    function Floor(){
        
        //背景贴图纹理
        this.bgTexture = null;
        //最大右边距离
        this.maxRight = 0;
        //判断是否超过右边最大距离了
        this.isOutComplete = false;
        //背景
        this.bg = null;
        //背景右边补丁
        this.rightBg = null;
        //当前地板上面的物品集合
        this.itemList = ;
        
		Floor.__super.call(this);
    }
    
    
    //事件名称
    //超过屏幕一定值出发新的floor事件
    Floor.OUT_COMPLETE = "floor_out_complete";
    //整个地板都不在屏幕里面事件
    Floor.OUT_DIE = "floor_out_die";
	//Floor 是一个显示对象 继承此 Sprite
	Laya.class(Floor, "Floor", laya.display.Sprite);
    
    var _proto = Floor.prototype;

    /**
     * type int  1->地板默认宽度 other->随机宽度 
     */
    _proto.init = function(type){
        //是否需要在地板上面增加道具
        var needItem = true;
        this.maxRight = 0;
        //如果不开启autoSize 父容器的宽度和高度无法获取 
        this.autoSize = true;
        //初始化的时候将坐标放到屏幕右边
        this.x = Config.GameWidth;
        //y坐标取一个随机值 为什么是32 因为我们的整个素材是 32 * 20 拼起来的
        this.y = 32 * 6 + 32 * parseInt(8 * Math.random());
        if(this.bg == null){
            //贴图纹理
            this.bgTexture = Laya.loader.getRes("res/floor.png");
            
            this.bg = new laya.display.Sprite();
            this.bg.graphics.clear();
            this.addChild(this.bg);
            
            //因为上面的图片是截取的 所以右边可能没有图片了 这里补一个
            this.rightBg = new laya.display.Sprite();
			this.rightBg.graphics.drawTexture(laya.resource.Texture.createFromTexture(this.bgTexture,32*29,0,32,96), 0, 0, 32, 96);
            this.rightBg.width = 32;
            this.addChild(this.rightBg);
        }
        switch(type){
            case 1:
                this.rightBg.visible = false;
			    this.bg.graphics.drawTexture(this.bgTexture, 0, 0, 960, 96);
                //默认宽度的地板不要道具
                needItem = false;
            break;
            default:
                //随机计算一个宽度 当然 最小是3倍 以防难度太难
                var _w = 32 * (3 + parseInt(19 * Math.random()));
                this.bg.graphics.clear();
                //这里用到了 laya.resource.Texture.createFromTexture 就是根据宽度和高度来截取一个图片并且返回一个Texture对象
			    this.bg.graphics.drawTexture(laya.resource.Texture.createFromTexture(this.bgTexture,0,0,_w,96), 0, 0, _w, 96);
                this.rightBg.visible = true;
                this.rightBg.x = _w;
            break;
        }
        //这个是用来补上右边的图片 所以X轴坐标正好是bg的宽度
        this.rightBg.x = _w;
        // this.bg.graphics.drawTexture(this.bgTexture, 0, 0, 960, 96);

        //计算一下右边还剩下多少 用来判断什么时候生成新的floor 
        //这里是通过游戏宽度 减去 固定 2个 32的宽度 再随机一个长度 这样 可以让地板时间点的出现 更加随机性
        this.maxRight = Config.GameWidth - 32 * 2 - 32 * parseInt(10 * Math.random());

        if(needItem){
            this.addItem();
        }

        //创建一个帧循环处理函数
        Laya.timer.frameLoop(1, this, this.onLoop);
    }
    //在地板上面添加物品
    _proto.addItem = function(){
        
        //创建一个随机数
        var m = parseInt(Math.random() * 10);
        //如果随机数小于5 我们就不添加了 主要是怕道具太多了
        if(m < 5)return;
        //添加的数量
        var addNum = 0;
        //计算一下道具最大数量 我们强制道具的宽度都是32
        var maxNum = parseInt(this.width / 32);
        //这里自己订制一种数量的规则 
        if(maxNum > 5){
            addNum = 5 + parseInt((maxNum - 5) * Math.random());
        }else{
            addNum = maxNum;
        }
        //计算居中的点
        var sx = (this.width - addNum * 32) * 0.5;
        var arr = ;
        var randNum;
        var specialItem = false;
        for(var i = 0; i < addNum; i++){
            //每隔两个创建一个 然物品分开一点
		    if(i % 2 == 0)continue;
            randNum = Math.random()
            //查询一下当前物品列表里面是否有 有的话 就从里面拿
            if(this.itemList.length > 0){
                item = this.itemList.shift();
                item.visible = true;
            }else{
                //对象池中拿Item
                var item = Pool.getItemByClass("item",Item);
            }
            //是否有特殊物品 如果有 我们就生成特殊物品
            if(randNum > 0.95 && !specialItem){
                specialItem = true;
                item.init(Item.ITEM_TYPE_SPEED);
            }else if(randNum > 0.9 && !specialItem){
                specialItem = true;
                item.init(Item.ITEM_TYPE_FLY);
            }else{
                item.init(Item.ITEM_TYPE_STAR);
            }
            
            item.x = sx + i * 32;
            item.y = -30;
            this.addChild(item);
            arr.push(item);
        }
        //存储当前所有item
        this.itemList = .concat(arr);
    }
    //获取当前地板上面的所有物品 
    _proto.getItems = function(){
        return this.itemList;
    }

    _proto.onLoop = function(){
        //让地板的速度和移动比背景快一点
        this.x -= 5 * 1.2;
        
        //判断是否除了边界 如果出了 就通知生成新的floor 这里增加一个变量来判断当前是否已经通知外部了 
        //因为此处是一个循环的处理
        if(!this.isOutComplete && (this.x + this.width) < this.maxRight){
            this.isOutComplete = true;
            this.event(Floor.OUT_COMPLETE, this);
        }else if((this.x + this.width) < 0){
            //判断整个floor是否不在屏幕里面了 如果不在了 移除当前floor
            Laya.timer.clear(this, this.onLoop);
            //如果有物品先隐藏
            for(var i = 0; i < this.itemList.length; i++){
                this.itemList[i].visible = false;
            }
            this.visible = false;
            this.event(Floor.OUT_DIE, this);
        }
    }
    /**
     * 检测碰撞
     * x 坐标
     * y 坐标
     */
    _proto.checkHit = function(x,y){
        if(x > this.x && x < (this.x + this.width) && y > this.y && y < (this.y + this.height)){
            return true;
        }
        return false;
    }
})();[/i]

总上面的代码我们主要是新增了一个itemList 存储地板上面所有的物品
因为Floor用到了对象池的方式来创建所以地板上面的物品我们也缓存起来每次地板消失我们就让item隐藏然后再创建item的时候先看看原先地板上面有没有可以用到的item 如果有我们就让它显示出来这样就可以避免重复去创建item 减少sprite的创建和内存的消耗
好我们刷新看看页面

有木有？道具出来了而且都在地板的中间
嗯~~ 其实这里代码量有点多大家休息休息消化一下~~~
既然有道具了

那我们来增加玩家和道具的碰撞代码打开runGame.js

(function () {
	/**
	 * 游戏入口
	 */
	function RunGame(){

		this.bg = null;
		this.mapFloor = null;
		this.player = null;

		this.flyEnergy = null;
		this.speedEnergy = null;

		this.scoreTxt = null;
		this.score = 0;
		//物品碰撞检测坐标点
        this.itemPoint = new Point();

		RunGame.__super.call(this);
		this.init();
	}
	//RunGame 是一个显示对象 继承此 Sprite
	Laya.class(RunGame,"RunGame", laya.display.Sprite);
	
	//定义RunGame的prototype
	var _proto = RunGame.prototype;
	
	//初始化
	_proto.init = function(){
		console.log('RunGame Init');

		//背景
		this.bg = new Background();
		this.addChild(this.bg);
		//地板
		this.mapFloor = new MapFloor();
		this.addChild(this.mapFloor);
		
		//飞行能量条
		this.flyEnergy = new Hp(Hp.HP_TYPE_ENERGY);
		this.flyEnergy.y = 7;
		this.addChild(this.flyEnergy);
		
		//速度能量条
		this.speedEnergy = new Hp(Hp.HP_TYPE_SPEED);
		this.speedEnergy.y = 7;
		this.speedEnergy.x = this.flyEnergy.width + 10;
		this.addChild(this.speedEnergy);
		
		//玩家
		this.player = new Player();
		this.player.x = 32 * 8;
		this.player.y = 32 * 4;
		this.addChild(this.player);

		//分数
		this.scoreTxt = new Text();
		this.scoreTxt.color = "#ffffff";
		this.scoreTxt.fontSize = 30;
		this.scoreTxt.text = "0";
		this.scoreTxt.width = Config.GameWidth;
		this.scoreTxt.align = "right";
		this.scoreTxt.x = -10;
		this.scoreTxt.y = 10;
		this.addChild(this.scoreTxt);
		//监听 按下 弹起 事件
		Laya.stage.on(laya.events.Event.MOUSE_DOWN, this, this.onMouseDown);
		Laya.stage.on(laya.events.Event.MOUSE_UP, this, this.onMouseUp);

        //创建一个帧循环处理函数
        Laya.timer.frameLoop(1, this, this.onLoop);
	}
	_proto.onLoop = function(){
		// 检测人物是否踩在地板上面了
		for(var i = this.mapFloor.numChildren - 1; i > -1; i--){
			var floor = this.mapFloor.getChildAt(i);
			//检测人物是否踩在地板上面了
			if(floor.checkHit(this.player.x, this.player.y)){
				//检测是否碰到道具了
				var itemList = floor.getItems();
				for(var j = 0; j < itemList.length; j++){
					var item = itemList[j];
					//只有显示的物品才做碰撞检测
					if(item.visible){
						//拿到物品的坐标 
						this.itemPoint.x = item.x + floor.x + this.player.width;
						this.itemPoint.y = item.y + floor.y + this.player.height;
						//物品碰到人物了
						if(this.player.hitTestPoint(this.itemPoint.x, this.itemPoint.y)){
							//物品有多个类型 分类型进行判断
							if(item.type == Item.ITEM_TYPE_SPEED){
								item.visible = false;
							}else if(item.type == Item.ITEM_TYPE_FLY){
								item.visible = false;
							}else{
								//星星物品播放动画
        						Tween.to(item, {y : -10, scaleX : 0.1, alpha : 0}, 300, null, Handler.create(this, this.itemTweenComplete, [item]));
								this.updateScore();
							}
						}
					}
				}
				//人物如果踩到地板了 就把人物的坐标设置到地板上面
				this.player.y = floor.y;
				//如果到地板上面的 就得重置跳的方法
				this.player.jumpReset();
			}
		}
	}
	//点击 出发人物 跳跃
	_proto.onMouseDown = function(){
		this.player.jump();
	}
	_proto.onMouseUp = function(){
		this.player.gotoJump();
	}
	//更新分数
	_proto.updateScore = function(){
		this.score++;
		this.scoreTxt.text = this.score;
	}
})();

试一下~~~ 是不是能碰到道具了？嘿嘿
好道具都OK了上面的代码也增加了积分
还有我们在上面的代码也增加了当前道具类型的判断方便后面我们给道具增加特效

======================== 特效 ========================
1、特效触发时画面暂停
2、玩家残影（触发游戏暂停和加速效果）
3、玩家特效
画面暂停？
嗯也就是让游戏中的背景地板等都不做运动
那我们想一下之前我们的背景和地板的运动都是在自己本身模块中操作的
因此我们只要增加一个游戏暂停的开关来控制她们是否需要运动
同时我们上面提到游戏要有加速的效果也就是物品移动的速度是可以动态改变的
因此打开Config.js 我们创建一些需要的变量

接下来我们修改一下Background.js 和 floor.js

这样子我们只要设置一下Config.isPause 就可以控制背景和地板是否停止运动了
同时还可以动态去改变Config.speed 来改变加速度
（因为我们这个游戏比较小所以采用这种全局静态变量来达到我们需要的效果如果是比较复杂的游戏可能做法不一样这个大家可以互相给一些小提议~~）

我们先做残影什么是残影？

看图说话~~~
这个最简单了
我们只要复制2个玩家然后设置一下x轴和透明度即可

我们增加两个动画设置不同透明度和X轴坐标然后再播放动作的时候让这两个动画和当前玩家的动画同步即可~~

残影有了我们再给玩家加上特效动画
比如一个光圈放大

var texture = Laya.loader.getRes("res/spiritEffect.png");
            this.spiritEffect = new Sprite();
            this.spiritEffect.pivot(154 * 0.5, 190 * 0.5);
            this.spiritEffect.visible = false;
            this.spiritEffect.scale(5, 5);
            this.spiritEffect.graphics.drawTexture(texture, 0, 0, 154, 190);
            this.addChild(this.spiritEffect);[/i][/code][i]然后增加一个特效触发的方法
 [code]//是否处于特效效果中
    _proto.isEffect = function(){
        return this.bodyEffect1.visible;
    }
    //开始显示特效
    _proto.showEffect = function(){
        Config.isPause = true;
        Config.speed = Config.SPEED_FAST;
        this.spiritEffect.visible = true;
        Tween.to(this.spiritEffect, {scaleX : 0.1, scaleY : 0.1, rotation : 360}, 1000, null, Handler.create(this, this.spiritEffectTweenComplete));
    }
    _proto.spiritEffectTweenComplete = function(){
        this.spiritEffect.visible = false;
        this.spiritEffect.scale(5, 5);
        this.bodyEffect1.visible = true;
        this.bodyEffect2.visible = true;
        Config.isPause = false;
}

然后我们在碰到特效道具的时候执行showEffect就可以了我们刷新页面看看效果哦

是不是很炫（哈哈~~~~ 其实好像不是很炫）反正效果是出来了
既然有了加速效果我们得控制加速的时间不能一直加速也就是我们前面提到的加速能量条和悬空能量条

因为我们所有的玩家操作都在Player.js里面所以我们这里简单处理一下吧前面提到的两种能量条引用到 Player.js里面具体操作如下
1、玩家悬空的时候需要慢慢扣除悬空能量，而非悬空状态会慢慢的恢复能量
2、玩家捡到悬空能量药水可以立马恢复悬空能量

======================== 其他 ========================
关于游戏开始当然得有介绍以及游戏结束啦
我们把Loading.js GameInfo.js GameOver.js加上

(function () {
	
	/**
	 * 加载类
	 */
	function Loading(){
		this.bg = null;
		this.txt = null;
		Loading.__super.call(this);
		this.init();
	}
	//Loading
	Laya.class(Loading,"Loading", laya.display.Sprite);
	
	var _proto = Loading.prototype;
	
	_proto.init = function(){
		
		//黑色背景
		this.bg = new Sprite();
		this.bg.graphics.drawRect(0,0,Config.GameWidth,Config.GameHeight,"#000000");
		this.addChild(this.bg);
		
		//loading文本
		this.txt = new Text();
		this.txt.color = "#ffffff";
		this.txt.fontSize = 30;
		this.txt.text = "Loading";
		this.txt.width = Config.GameWidth;
		this.txt.align = "center";
		this.txt.y = (Config.GameHeight - this.txt.height) * 0.5;
		this.addChild(this.txt);
		
	}
	_proto.progress = function(value){
		this.txt.text = "Loading " + parseInt(value * 100) + "%";
	}
	
})();[/i][/code][code][i](function () {
	
	/**
	 * 游戏介绍
	 */
	function GameInfo(){
		this.bg = null;
		this.txt = null;
		GameInfo.__super.call(this);
		this.init();
	}
	//GameInfo
	Laya.class(GameInfo,"GameInfo", laya.display.Sprite);
	
	var _proto = GameInfo.prototype;
	
	_proto.init = function(){
		this.width = Config.GameWidth;
		this.height = Config.GameHeight;
		//黑色背景
		this.bg = new Sprite();
		this.bg.alpha = 0.8;
		this.bg.graphics.drawRect(0,0,Config.GameWidth,Config.GameHeight,"#000000");
		this.addChild(this.bg);
		
		//loading文本
		this.txt = new Text();
		this.txt.color = "#ffffff";
		this.txt.fontSize = 20;
		this.txt.text = "游戏介绍\n\n点击可控制人物跳跃\n\n（小提示 点两次可触发人物连跳 再连跳后 再次点击可出发人物飞行哦！）\n\n左上角紫色条代表当前飞行的精力 黄色条 代表加速状态\n\n\n好了 点击屏幕开始狂奔之旅吧~~";
		this.txt.width = Config.GameWidth;
		this.txt.align = "center";
		this.txt.y = (Config.GameHeight - this.txt.height) * 0.5;
		this.addChild(this.txt);
		
	}
	
	
})();[/i][/code] [code][i](function () {
	
	/**
	 * 游戏结束
	 */
	function GameOver(){
		this.bg = null;
		this.txt = null;
		GameOver.__super.call(this);
		this.init();
	}
	//GameOver
	Laya.class(GameOver,"GameOver", laya.display.Sprite);
	
	var _proto = GameOver.prototype;
	
	_proto.init = function(){
		this.width = Config.GameWidth;
		this.height = Config.GameHeight;
		//黑色背景
		this.bg = new Sprite();
		this.bg.alpha = 0.8;
		this.bg.graphics.drawRect(0,0,Config.GameWidth,Config.GameHeight,"#000000");
		this.addChild(this.bg);
		
		//loading文本
		this.txt = new Text();
		this.txt.color = "#ffffff";
		this.txt.fontSize = 30;
		this.txt.text = "GameOver\n\nClick Again";
		this.txt.width = Config.GameWidth;
		this.txt.align = "center";
		this.addChild(this.txt);
		
	}

	_proto.setScore = function(score){
		var _score = LocalStorage.getItem('runGameScore');
		if(_score && parseInt(_score) > score){
			score = _score;
		}
		LocalStorage.setItem('runGameScore',score);
		this.txt.text = "GameOver\n\n Click Again\n\n Best Score : " + score;
		this.txt.y = (Config.GameHeight - this.txt.height) * 0.5;
	}
})();

剩下的都是比较简单的~~ 如果看过前面章节的人很快就知道如何去应对实在不行我们看源码嘿嘿
源码都有相应的注释如果有问题可以留言或者私信谢谢大家捧场~~~

好啦~ 到此为止本系列教程都结束了源码在下面~~
如果有建议可以互相讨论嘿嘿~~
尽量开启下一个小游戏之旅~~~~ 有什么小游戏也可以私聊或者留言大家一起分享一起学习~~ 一起进步。。
TKS~~~

附件：
LayaAir_简单跑酷JS版_-_05-终篇.zip

LayaAir_简单跑酷JS版_-_05-终篇.zip