从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 }
发表评论:
◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。