26
2016
04

密室逃生-animateCC版

从egret的示例中发现一个挺好玩的游戏,自己照着做了一下。

原始游戏地址:http://edn.egret.com/cn/article/index/id/891

egret还不太熟悉,最近在用animate cc,就用animate cc做了一个。

使用了之前提到的:AnimateCC实现文档类AnimateCC实现库链接 。

主要代码如下:

Main.js

function Main(){ 
	var s=exportRoot;

	var __startLayer=s.__startLayer;
	var __gameLayer=s.__gameLayer;
	var __overLayer=s.__overLayer;

	var tx=0;
	var levelCount;
	var count=0;
	var score=0;
	var level=1;
	var maxScore=0;
	var hero=__gameLayer.hero;
	var mapLayer=__gameLayer.mapLayer;
	var topWall;
	
	__gameLayer.addChildAt(hero,0);
	__gameLayer.addChildAt(mapLayer,0);
	
	__gameLayer.visible=__overLayer.visible=false;

	__startLayer.startBtn.addEventListener("click",startGame);
	__overLayer.replayBtn.addEventListener("click",replayGame);
	__overLayer.showBtn.addEventListener("click", makeAshow);


	hero.init();
	mapLayer.init();
	/**
	 * 初始化游戏
	 */
	function initGame(f){ 
		if(f){ 
			score=0;
			level=1;
		}
		else{ 
			level++;
		}
		refrenceScore();
		count=0;
		
		levelCount=60-level;//关卡越高,时间越短
		mapLayer.initData();
		topWall=mapLayer.topWallCon;
		topWall.initY=topWall.y;
		hero.setState(hero.STATE1);
		tx=4;
		setHeroPosition(tx,10);

		stage.addEventListener("click",stageClickHandler);
		stage.addEventListener("tick",myTick);
	}
	
	/**
	 * 开始游戏
	 * @param e
	 */
	function startGame(e){ 
		__gameLayer.visible=true;
		__startLayer.visible=false;
		initGame(true);
	}
	/**
	 * 游戏结束
	 */
	function gameOver(){ 
		__gameLayer.visible=false;
		__overLayer.visible=true;
		__overLayer.scoreMc.show(score);
		__overLayer.maxScoreMc.show(maxScore);
	}
	/**
	 * 再玩一次
	 * @param e
	 */
	function replayGame(e){ 
		__gameLayer.visible=true;
		__overLayer.visible=false;
		initGame(true);
	}
	/**
	 * 炫耀一下
	 */
	function makeAshow(e){ 
		alert("还没有做出来");
	}
	/**
	 * 墙初始化
	 */
	function initMap(){ 
		var min=150;
		var w=60;
		var flag=false;
		var len=8;
		bottomRects=[];
		topRects=[];
		//
		for(i=0;i<len;i++){ 
			var h=min+Math.floor(Math.random()*8)*10;
			bottomRects.push(new createjs.Rectangle(i*w,Consts.GAME_HEIGHT-h,w,h));
			h=Consts.GAME_HEIGHT-h;
			if(Math.random()<0.2||( (i==len-1) &&!flag)){ 
				var index=Math.floor(Math.random()*spaceArr.length);
				h-=spaceArr[index];
				flag=true;
			}
			topRects.push(new createjs.Rectangle(i*w,0,w,h));
		}
	}
	/**
	 * 设置hero的位置
	 * @param index
	 */
	function setHeroPosition(index,offY){ 
		var rect=mapLayer.bottomRects[index];
		hero.x=rect.x+rect.width/2;
		hero.y=rect.y+offY;
	}

	
	/**
	* 点击舞台
	*/
	function stageClickHandler(e){
		//console.log(e)
		tx=parseInt(e.stageX/60);
	}

	function myTick(e){ 
		var hx=parseInt(hero.x/60);
		if(tx>hx){
			hx++;
			setHeroPosition(hx,10);
		}
		else if(tx<hx){
			hx--;
			setHeroPosition(hx,10);
		}
		count++;
		if(count<levelCount){ 
			//暂时do nothing
		}
		else if(count<levelCount+20-level*0.2){
			//shake
			if(topWall.y<=topWall.initY){ 
				topWall.y+=5;
			}
			else{ 
				topWall.y-=5;
			}
			topWall.speed=(0-topWall.y)/3;
		}
		else{ 
			//drop
			topWall.y+=topWall.speed;
			if(topWall.y>=0){ 
				topWall.y=0;
				stage.removeEventListener("click",stageClickHandler);
				stage.removeEventListener("tick",myTick);
				
				if(checkState(hx)){ //过关
					score+=10;
					if(score>maxScore){ 
						maxScore=score;
					}
					refrenceScore();
					setTimeout(initGame,1000,false);
				}
				else{ //死亡
					setTimeout(gameOver,1000,false);
				}
			}
		}
	}
	/**
	 * 刷新分数,关卡
	 */
	function refrenceScore(){ 
		__gameLayer.scoreMc.show(score);
		__gameLayer.levelMc.show(level);
	}
	/**
	 * 检测状态,并设置hero的状态
	 * @param hx
	 */
	function checkState(hx){ 
		var st=spaceIndexArr[hx];
		if(st==-1){ 
			hero.setState(hero.STATE5);
			setHeroPosition(hx,-10);
			return false;
		}
		else if(st==0){ 
			hero.setState(hero.STATE3);
		}
		else if(st==1){ 
			hero.setState(hero.STATE2);
		}
		else if(st==2){ 
			hero.setState(hero.STATE4);
		}
		else if(st==3){ 
			hero.setState(hero.STATE1);
		}
		return true;
	}
}

//----------------Hero.js---------------
p=lib.Hero.prototype;
p.FRAMES=[[2,3,4,5,6],[7],[8,9],[10,11],[20,21,22,23,24]];
p.STATE1=0;
p.STATE2=1;
p.STATE3=2;
p.STATE4=3;
p.STATE5=4;

p.init=function(){ 
	var s=this;
	s.state=0;
	s.currentFrames=[];
	s.currentFrameIndex=0;
	s.runFlag=0;
	s.isLoop=false;
	s.addEventListener("tick",run);
	function run(e){ 
		var len=s.currentFrames.length;

		if(len==0){ 
			s.stop();
			return;
		}
		s.currentFrameIndex++;
		if(s.currentFrameIndex>=len){ 
			if(s.isLoop)s.currentFrameIndex=0;
			else s.currentFrameIndex--;
		}
		s.gotoAndStop(s.currentFrames[s.currentFrameIndex]);
	}
}

p.setState=function(state){ 
	var s=this;
	s.state=state;
	if(s.state==s.STATE5){ 
		s.isLoop=false;
	}
	else{ 
		s.isLoop=true;
	}
	if(s.state==s.STATE3||s.state==s.STATE4){ 
		this.currentFrames=[Math.random()>0.5?s.FRAMES[s.state][0]:s.FRAMES[s.state][1]];
	}
	else{ 
		this.currentFrames=s.FRAMES[s.state];
	}
	s.currentFrameIndex=0;
	s.gotoAndStop(s.currentFrames[s.currentFrameIndex]);
}

//----------------NumberShowMc.js---------------------
p=lib.NumberShowMc.prototype;
p.show=function(value){ 
	var s=this;
	var mcArr=[s.num0,s.num1,s.num2,s.num3,s.num4];
	var arr=[];
	var quo=0;
	var rem=0;
	do{ 
		quo=parseInt(value/10);
		rem=value%10;
		arr.push(rem);
		value=quo;
	}while(value);

	var n1=mcArr.length;
	var n2=arr.length;
	var n=Math.min(n1,n2);
	for(i=0;i<n1;i++){ 
		var mc=mcArr[n1-i-1];
		if(i<n2){ 
			var v=arr[i];
			mc.gotoAndStop(v);
			mc.visible=true;
			mc.x=((n-i-1)-(n-1)/2)*18;
		}
		else{ 
			mc.visible=false;

		}
	}
}


//----------------MapLayer.js-----------------
p=lib.MapLayer.prototype;
p.spaceArr=[50,70,90,110];

p.init=function(){ 
	var s=this;
	s.removeAllChildren();
	s.bottomRects=[];
	s.topRects=[];
	s.spaceIndexArr=[];

	var bottomWallCon=new createjs.Container();
	var bottomWall=new lib.Wall();
	var maskBottom=new createjs.Shape();
	var bottomline=new createjs.Shape();
	s.addChild(bottomWallCon);
	bottomWallCon.addChild(bottomWall);
	bottomWallCon.addChild(bottomline);
	bottomWall.mask=maskBottom;

	var topWallCon=new createjs.Container();
	var topWall=new lib.Wall();
	var maskTop=new createjs.Shape();
	var topLine=new createjs.Shape();
	s.addChild(topWallCon);
	topWallCon.addChild(topWall);
	topWallCon.addChild(topLine);
	topWall.mask=maskTop;

	

	s.maskTop=maskTop;
	s.topLine=topLine;
	s.maskBottom=maskBottom;
	s.bottomline=bottomline;
	s.topWallCon=topWallCon;
	s.bottomWallCon=bottomWallCon;
}

p.initData=function(){ 
	var s=this;
	var min=150;
	var w=60;
	var flag=false;
	var len=8;

	s.bottomRects=[];
	s.topRects=[];
	spaceIndexArr=[-1,-1,-1,-1,-1,-1,-1,-1];
	//
	for(var i=0;i<len;i++){ 
		var h=min+Math.floor(Math.random()*8)*10;
		s.bottomRects.push(new createjs.Rectangle(i*w,Consts.GAME_HEIGHT-h,w,h));
		h=Consts.GAME_HEIGHT-h;
		if(Math.random()<0.2||( (i==len-1) &&!flag)){ 
			var index=Math.floor(Math.random()*s.spaceArr.length);
			spaceIndexArr[i]=index;
			h-=s.spaceArr[index];
			flag=true;
		}
		s.topRects.push(new createjs.Rectangle(i*w,0,w,h));
	}

	//
	
	fill(s.maskTop.graphics,s.topRects);
	drawTopLine();
	fill(s.maskBottom.graphics,s.bottomRects);
	drawBottomLine();
	s.topWallCon.y=-200;

	function fill(g,rects){ 
		g.clear();
		g.beginFill("#00cc00");
		for(var i=0;i<len;i++){
			var rect=rects[i];
			g.drawRect(rect.x,rect.y,rect.width,rect.height);
		}
		g.endFill();
	}
	function drawTopLine(){
		var g=s.topLine.graphics;
		g.clear();
		g.setStrokeStyle(10).beginStroke("#33E7FE");
		for(var i=0;i<len;i++){ 
			var rect=s.topRects[i];
			if(i==0)g.moveTo(i*w,rect.height);
			else g.lineTo(i*w,rect.height);
			g.lineTo(i*w+w,rect.height);
		}
		g.endStroke();
	}
	function drawBottomLine(){
		var g=s.bottomline.graphics;
		g.clear();
		g.setStrokeStyle(10).beginStroke("#33E7FE");
		for(var i=0;i<len;i++){ 
			var rect=s.bottomRects[i];
			if(i==0)g.moveTo(i*w,rect.y);
			else g.lineTo(i*w,rect.y);
			g.lineTo(i*w+w,rect.y);
		}
		g.endStroke();
	}
}

var Consts={ 
	GAME_WIDTH:480,
	GAME_HEIGHT:650
}

源码打包下载

« 上一篇下一篇 »

相关文章:

显示fps  (2020-1-19 9:16:17)

js保留有效数字  (2019-7-30 15:32:12)

js的parseInt方法  (2019-2-15 9:12:44)

闪电效果  (2017-11-28 15:4:19)

js中判断一个对象的类型  (2017-3-30 14:27:35)

解九连环  (2016-12-1 20:58:11)

DataURL与File,Blob,canvas对象之间的互相转换的Javascript  (2016-11-25 14:58:41)

js生成条形码-barcode  (2016-10-12 15:59:51)

GeoJSON格式  (2016-9-23 13:28:44)

使用Typescript开发基于createjs的项目  (2016-8-25 9:54:40)

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。