【分享】飞机大战源码

摘要

游戏介绍

这是一款经典飞行射击类游戏,精美绚丽的画面,整体环境主要还是围绕太空为主

如何开始

游戏加载完成后点击界面即可开始游戏。

操作方法

鼠标控制飞机左右上下移动,子弹无限发射,鼠标移出界面自动暂停,只有三条命,小敌机一滴血,中敌机3滴血,大敌机7滴血

游戏目标

消灭更多的敌机,赢取更高的分数。

【分享】飞机大战源码

最近比较忙,没有及时更新博客!

分享一下比较火的,经典的飞机大战源码

 

HTML代码比较简单
<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title><a href="http://www.ldhblog.com/tag/%e9%a3%9e%e6%9c%ba/" title="查看与 飞机 相关的文章"target="_blank">飞机</a><a href="http://www.ldhblog.com/tag/%e5%a4%a7%e6%88%98/" title="查看与 大战 相关的文章"target="_blank">大战</a></title>
	<style>
		body{
			margin:0;
			text-align:center;
		}
		canvas{
			background:#aaa;
		}
		
	</style>
</head>
<body>
	<canvas id="canvas">
		您的浏览器不支持Canvas绘图!
	</canvas>
	<script src="app_v9.js"></script>
</body>
</html>
下面的是js代码,都有备注,应该比较容易看懂
/*****全局变量******/
var canvasWidth = 480;//画布的宽
var canvasHeight = 650;//画布的高
var canvas=document.getElementById('canvas');
canvas.width=canvasWidth;
canvas.height=canvasHeight;
var ctx=canvas.getContext('2d');


const PHASE_DOWNLOAD=1;//图片下载阶段
const PHASE_READY=2;//就绪阶段
const PHASE_LOADING=3;//;游戏加载阶段
const PHASE_PLAY=4;//游戏进行阶段
const PHASE_PAUSE=5;//游戏暂停阶段
const PHASE_GAMEOVER=6;//游戏结束阶段
var heroCount=3;//剩余可用英雄的命
var heroScore=0;//英雄的得分

/***所有的图片变量***/

var imgBackground;
var imgBullet1;
var imgsEnemy1=[];//小号敌机的所有图片

var imgsEnemy2=[];//中号敌机的所有图片

var imgsEnemy3=[];//大号敌机的所有图片

var imgsGameLoading=[];//加载游戏的所有图片

var imgsHero=[];//英雄的所有图片

var imgStart;//就绪阶段的图片
/***阶段1 下载图片****/
/*function function download(){
	var progress=0;
	ctx.font='80px Helvetica';
	ctx.fillStyle="#eee";
	function drowProgress(){
		var txt=progress+'%';
		ctx.fillText(txt,100,200);
		ctx.strokeText(txt,100,200);
		
	}
	imgBackground=new Image();
	imgBackground.src='img/background.png';
	imgBackground.onload=function(){
		progress+=4;
		drawProgress();
	}
}*/

/***阶段1 下载图片****/
var curPhase=PHASE_DOWNLOAD;//当前所处的阶段
download();//开始下载图片

function download(){
	var progress=0;//下载进度
	function drawProgress(){
		ctx.clearRect(0,0,480,650);
		ctx.fillText(progress+'%',320,330);
		ctx.font="40px SimHei";
		ctx.strokeRect(100,300,200,30);
		ctx.fillStyle="#00ff7f";
		ctx.fillRect(100,300,progress*2,30);
		ctx.fillRect(300,305,10,20);
		ctx.fillStyle="#2e8b57";
		ctx.strokeRect(300,305,10,20);
		ctx.strokeStyle="#2e8b57";
		
		if(progress>=100){//所有图片加载完成,开始游戏
			startGame();
		}
		
	}
	/*****1*****/
	imgBackground=new Image();
	imgBackground.src='img/background.png';
	imgBackground.onload=function(){
		progress+=4;
		drawProgress();
	}
	/*****2*****/
	imgBullet1=new Image();
	imgBullet1.src='img/bullet1.png';
	imgBullet1.onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****3*****/
	imgsEnemy1[0]=new Image();
	imgsEnemy1[0].src='img/enemy1.png';
	imgsEnemy1[0].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****4*****/
	imgsEnemy1[1]=new Image();
	imgsEnemy1[1].src='img/enemy1_down1.png';
	imgsEnemy1[1].onload=function(){
		progress+=3;
		drawProgress();
	}
	/******5****/
	imgsEnemy1[2]=new Image();
	imgsEnemy1[2].src='img/enemy1_down2.png';
	imgsEnemy1[2].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****6*****/
	imgsEnemy1[3]=new Image();
	imgsEnemy1[3].src='img/enemy1_down3.png';
	imgsEnemy1[3].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****7*****/
	imgsEnemy1[4]=new Image();
	imgsEnemy1[4].src='img/enemy1_down4.png';
	imgsEnemy1[4].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****8*****/
	imgsEnemy2[0]=new Image();
	imgsEnemy2[0].src='img/enemy2.png';
	imgsEnemy2[0].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****9*****/
	imgsEnemy2[1]=new Image();
	imgsEnemy2[1].src='img/enemy2_down1.png';
	imgsEnemy2[1].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****10*****/
	imgsEnemy2[2]=new Image();
	imgsEnemy2[2].src='img/enemy2_down2.png';
	imgsEnemy2[2].onload=function(){
		progress+=3;
		drawProgress();
	}
	/******11****/
	imgsEnemy2[3]=new Image();
	imgsEnemy2[3].src='img/enemy2_down3.png';
	imgsEnemy2[3].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****12*****/
	imgsEnemy2[4]=new Image();
	imgsEnemy2[4].src='img/enemy2_down4.png';
	imgsEnemy2[4].onload=function(){
		progress+=3;
		drawProgress();
	}
	/****13******/
	imgsEnemy3[0]=new Image();
	imgsEnemy3[0].src='img/enemy3_n1.png';
	imgsEnemy3[0].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****14*****/
	imgsEnemy3[1]=new Image();
	imgsEnemy3[1].src='img/enemy3_n2.png';
	imgsEnemy3[1].onload=function(){
		progress+=3;
		drawProgress();
	}
	/****15******/
	imgsEnemy3[2]=new Image();
	imgsEnemy3[2].src='img/enemy3_hit.png';
	imgsEnemy3[2].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****16*****/
	imgsEnemy3[3]=new Image();
	imgsEnemy3[3].src='img/enemy3_down1.png';
	imgsEnemy3[3].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****17*****/
	imgsEnemy3[4]=new Image();
	imgsEnemy3[4].src='img/enemy3_down2.png';
	imgsEnemy3[4].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****18*****/
	imgsEnemy3[5]=new Image();
	imgsEnemy3[5].src='img/enemy3_down3.png';
	imgsEnemy3[5].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****19*****/
	imgsEnemy3[6]=new Image();
	imgsEnemy3[6].src='img/enemy3_down4.png';
	imgsEnemy3[6].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****20*****/
	imgsEnemy3[7]=new Image();
	imgsEnemy3[7].src='img/enemy3_down5.png';
	imgsEnemy3[7].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****21*****/
	imgsEnemy3[8]=new Image();
	imgsEnemy3[8].src='img/enemy3_down6.png';
	imgsEnemy3[8].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****22*****/
	imgsGameLoading[0]=new Image();
	imgsGameLoading[0].src='img/game_loading1.png';
	imgsGameLoading[0].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****23*****/
	imgsGameLoading[1]=new Image();
	imgsGameLoading[1].src='img/game_loading2.png';
	imgsGameLoading[1].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****24*****/
	imgsGameLoading[2]=new Image();
	imgsGameLoading[2].src='img/game_loading3.png';
	imgsGameLoading[2].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****25*****/
	imgsGameLoading[3]=new Image();
	imgsGameLoading[3].src='img/game_loading4.png';
	imgsGameLoading[3].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****26*****/
	imgGamePauseNor=new Image();
	imgGamePauseNor.src='img/game_pause_nor.png';
	imgGamePauseNor.onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****27*****/
	imgsHero[0]=new Image();
	imgsHero[0].src='img/hero1.png';
	imgsHero[0].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****28*****/
	imgsHero[1]=new Image();
	imgsHero[1].src='img/hero2.png';
	imgsHero[1].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****29*****/
	imgsHero[2]=new Image();
	imgsHero[2].src='img/hero_blowup_n1.png';
	imgsHero[2].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****30*****/
	imgsHero[3]=new Image();
	imgsHero[3].src='img/hero_blowup_n2.png';
	imgsHero[3].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****31*****/
	imgsHero[4]=new Image();
	imgsHero[4].src='img/hero_blowup_n3.png';
	imgsHero[4].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****32*****/
	imgsHero[5]=new Image();
	imgsHero[5].src='img/hero_blowup_n4.png';
	imgsHero[5].onload=function(){
		progress+=3;
		drawProgress();
	}
	/*****33*****/
	imgStart=new Image();
	imgStart.src='img/start.png';
	imgStart.onload=function(){
		progress+=3;
		drawProgress();
	}
	
}
/****阶段2就绪***/
var sky;
var logo;
function startGame(){
	curPhase=PHASE_READY;
	sky=new Sky(imgBackground);//创建天空对象 并设置背景图片
	logo=new Logo(imgStart);
	startEngine();//启动整个游戏的主引擎-就是定时器
	//当鼠标点击画布,进入下一阶段
	canvas.onclick=function(){
		if(curPhase===PHASE_READY){//从就绪阶段进入加载阶段
			curPhase=PHASE_LOADING;
			loading =new Loading(imgsGameLoading);//创建loading对象
		}
	}
}
//天空的构造函数(面向对象)--使用两张图片轮换
function Sky(img){
	this.x1=0;//初始时第一张背景图的坐标
	this.y1=0;
	this.x2=0;//初始时第二张背景图的坐标
	this.y2=-img.height;
	this.draw=function(){//绘制天空的方法
	//每次绘制背景图都是铺满的,不需要清除
		ctx.drawImage(img,this.x1,this.y1);
		ctx.drawImage(img,this.x2,this.y2);
	}
	this.move=function(){//移动天空对象
		this.y1+=2;//图片坐标下移
		this.y2+=2;
		if(this.y1>=canvasHeight){//第一张背景图移出边界,
			this.y1=this.y2-img.height;
		}
		if(this.y2>=canvasHeight){//第二张背景图移出边界,
			this.y2=this.y1-img.height;
		}
	}
}
function Logo(img){
	this.x=canvasWidth/2-img.width/2;
	this.y=canvasHeight/2-img.height/2;
	this.draw=function(){
		ctx.drawImage(img,this.x,this.y);
	}
}

/****阶段3 加载中***/
//var loading =new Loading(imgsGameLoading);
var loading;
function Loading(imgs){
	this.x=0;
	this.y=canvasHeight-imgs[0].height;
	this.index=0;//当前要绘制数组哪一张图片的下标
	this.draw=function(){
		//console.log('draw.loading');
		//console.log(imgs[0].height);
		ctx.drawImage(imgs[this.index],this.x,this.y);
	}
	this.counter=0;//记录了move函数的调用次数
	this.move=function(){
		this.counter++;//只有当move函数被调用n次之后才会执行this.index++;
		if(this.counter%5===0){
			this.index++;//绘制下一张
		}
		if(this.index>=imgs.length){
			curPhase=PHASE_PLAY;//所有图片播放完成,进入下一阶段
			hero=new Hero(imgsHero);//进入游戏
			bulletList=new BulletList();//创建子弹列表
			enemyList=new EnemyList();//创建敌机
		}
	}
}


/****阶段4 游戏进行时***/
var hero;//此处不能new
//我方英雄的构造方法
function Hero(imgs){
	//我方飞机初始现在屏幕的下方
	this.x=canvasWidth/2-imgs[0].width/2;
	this.y=canvasHeight-imgs[0].height;
	this.width=imgs[0].width;
	this.height=imgs[0].height;
	this.index=0;//待绘制的是数组中的哪个
	this.crashed=false;//当前是否进入撞毁程序
	this.draw=function(){
		ctx.drawImage(imgs[this.index],this.x,this.y);
	}
	this.counter=0;
	this.move=function(){
		this.counter++;
		if(this.counter%5===0){
			if(!this.crashed){
				if(this.index===0){
				this.index=1;
				}else if(this.index===1){
				this.index=0;
				}		
			}else{//开始撞毁程序
				if(this.index===0||this.index===1)this.index=2;
				else if(this.index<imgs.length-1)this.index++;
				else {//坠毁程序,血格减一
					heroCount--;
					if(heroCount>0){
						hero=new Hero(imgsHero);
					}else{//血格已经为0
						curPhase=PHASE_GAMEOVER;
					}
					
				}
			}
			
		}
		//边移动,边发射子弹
		if(this.counter%10===0){//变量,间隔多久发射子弹(指定每2发的发射间隔)
			this.fire();
		}
	}
	this.fire=function(){
		var b=new Bullet(imgBullet1);
		bulletList.add(b);
	}
}
//当鼠标在画布上方移动时
canvas.onmousemove=function(event){
	if(curPhase===PHASE_PLAY){
		var x=event.offsetX;//鼠标事件相对于左上角的位置
		var y=event.offsetY;
		hero.x=x-imgsHero[0].width/2;
		hero.y=y-imgsHero[0].height/2;
	}
}
/*绘制子弹*/
function Bullet(img){//绘制子弹的构造方法
//子弹坐标的初始坐标
	this.x=hero.x+(imgsHero[0].width/2-img.width/2);
	this.y=hero.y-img.height;
	this.width=img.width;
	this.height=img.height;
	this.removable=false;//当前子弹能否删除
	this.draw=function(){
		ctx.drawImage(img,this.x,this.y);
	};
	//this.counter=0;
	
	this.move=function(){
		this.y-=10;//此处的应该是变量。指定的子弹移动速度;
		//飞出画布上边界,或打中敌机,子弹消失
		if(this.y<=-img.height){
			this.removable=true;
		}
	}
}
var bulletList;//不能new
function BulletList(){//子弹的列表对象,保存着当前的所有的子弹
	this.arr=[];//保存着画布的所有子弹
	this.add=function(bullet){//添加子弹的方法
		this.arr.push(bullet);//添加子弹
	}
	this.remove=function(i){//删除子弹的方法
		this.arr.splice(i,1);//删除子弹
	}
	this.draw=function(){//绘制每一个子弹
		for(var i in this.arr){
			this.arr[i].draw();
		}
	}
	this.move=function(){//删除每个子弹
		for(var i in this.arr){
			this.arr[i].move();//让每个子弹都移动
			if(this.arr[i].removable){
				this.remove(i);
			}
		}
	}
}
///////////////v6版本////////////////////
//小号敌机
function Enemy1 (imgs){
	this.x=Math.random()*(canvasWidth-imgs[0].width);//敌机x的坐标
	this.y=-imgs[0].height;//敌机y
	//console.log(this.x);
	//console.log(this.y);
	this.width=imgs[0].width;
	this.height=imgs[0].height;
	
	this.index=0;//当前绘制的图片在数组中的下标
	this.speed=5;//小飞机的飞行速度(42ms移动的距离)
	this.removable=false;//可以删除吗?
	this.blood=1;//小敌机只有一格血;
	this.crashed=false;//是否被撞毁
	this.draw=function(){
		ctx.drawImage(imgs[this.index],this.x,this.y);
	}
	this.counter=0;
	this.move=function(){
		this.counter++;
		this.y+=this.speed;
		this.checkHit();//碰撞检查
		
		//若飞出下边界,或撞毁则可以删除
		if(this.crashed && this.counter%2===0){
			if(this.index===0)this.index=1;
			else if(this.index<imgs.length-1)this.index++;
			else {
				this.removable=true;
				heroScore+=5;
			}
			
		}
		if(this.y>=canvasHeight){//飞出下边界
			this.removable=true;
		}
	}
	/////////碰撞检验
	/*
		碰撞满足的4个条件
		1  obj1.x+obj1.width>=obj2.x
		2  obj2.x+obj2.width>=obj1.x
		3  obj1.y+obi1.height>=obj2.y
		4  obj2.y+obj2.height>=obj1.y
	*/
	this.checkHit=function(){
		//每个敌机必须和我方子弹碰撞检验
		for(var i in bulletList.arr){
			var b=bulletList.arr[i];
			if((this.x+this.width>=b.x)
				&&(b.x+b.width>=this.x)
				&&(this.y+this.height>=b.y)
				&&(b.y+b.height>=this.y)){
					this.blood--;
					if(this.blood<=0){
						this.crashed=true;
					}
					b.removable=true;
			}
		}
		//每个敌机必须和我放英雄左蹦状检测
		if((this.x+this.width>hero.x)
			&&(hero.x+hero.width>=this.x)
			&&(this.y+this.height>hero.y)
			&&(hero.y+hero.height>=this.y)){
				hero.crashed=true;//我方英雄撞毁程序
		}
	}
}
//中号敌机//
function Enemy2 (imgs){
	this.x=Math.random()*(canvasWidth-imgs[0].width);//敌机x的坐标
	this.y=-imgs[0].height;//敌机y
	this.width=imgs[0].width;
	this.height=imgs[0].height;
	this.index=0;//当前绘制的图片在数组中的下标
	this.speed=3;//中飞机的飞行速度(42ms移动的距离)
	this.removable=false;//可以删除吗?
	this.blood=3;//中号敌机只有三格血;
	this.crashed=false;//是否被撞毁
	this.draw=function(){
		ctx.drawImage(imgs[this.index],this.x,this.y);
	}
	this.counter=0;//*
	this.move=function(){
		this.counter++;
		this.y+=this.speed;
		//若飞出下边界,则可以删除
		this.checkHit();//碰撞检查
		if(this.crashed && this.counter%2===0){
			if(this.index===0)this.index=1;
			else if(this.index<imgs.length-1)this.index++;
			else {
				this.removable=true;
				heroScore+=10;
			}
		}
		if(this.y>=canvasHeight ){//飞出下边界
			this.removable=true;
		}
	}
	//碰撞检查
	this.checkHit=function(){
		//每个敌机必须和我方子弹碰撞检验
		for(var i in bulletList.arr){
			var b=bulletList.arr[i];
			
			//console.log(this.x+'-'+this.y);
			//console.log(this.width+'-'+this.height);
			//console.log(b.x+'-'+b.y);
			//console.log(b.width+'-'+b.height);
			if((this.x+this.width>=b.x)
				&&(b.x+b.width>=this.x)
				&&(this.y+this.height>=b.y)
				&&(b.y+b.height>=this.y)){
					this.blood--;
					if(this.blood<=0){
						this.crashed=true;
					}
					b.removable=true;
			}
		}
		if((this.x+this.width>hero.x)
			&&(hero.x+hero.width>=this.x)
			&&(this.y+this.height>hero.y)
			&&(hero.y+hero.height>=this.y)){
				hero.crashed=true;//我方英雄撞毁程序
		}
	}
}
//大号敌机//
function Enemy3(imgs){
	this.x=Math.random()*(canvasWidth-imgs[0].width);//敌机x的坐标
	this.y=-imgs[0].height;//敌机y
	this.width=imgs[0].width;
	this.height=imgs[0].height;
	this.index=0;//当前绘制的图片在数组中的下标
	this.speed=1;//大飞机的飞行速度(42ms移动的距离)
	this.removable=false;//可以删除吗?
	this.blood=6;//大敌机只有六格血;
	this.crashed=false;//是否被撞毁
	this.draw=function(){
		ctx.drawImage(imgs[this.index],this.x,this.y);
	}
	this.counter=0//move函数的调用次数
	this.move=function(){
		this.counter++;
		this.y+=this.speed;
		this.checkHit();//碰撞检查
		if(this.counter%5===0){
			if(!this.crashed){//未开始撞毁程序
				if(this.index===0)this.index=1;
				else if(this.index===1)this.index=0;
			}else {
				if(this.index===0||this.index===1)this.index=3;
				else if(this.index<imgs.length-1)this.index++;
				else {
					this.removable=true;
					heroScore+=20;
				}
			}			
		}
		//若飞出下边界,则可以删除
		if(this.y>=canvasHeight){//飞出下边界
			this.removable=true;
		}
	}
	//碰撞检查
	this.checkHit=function(){
		//每个敌机必须和我方子弹碰撞检验
		for(var i in bulletList.arr){
			var b=bulletList.arr[i];
			//console.log(this.x+'-'+this.y);
			//console.log(this.width+'-'+this.height);
			//console.log(b.x+'-'+b.y);
			//console.log(b.width+'-'+b.height);
			if((this.x+this.width>=b.x)
				&&(b.x+b.width>=this.x)
				&&(this.y+this.height>=b.y)
				&&(b.y+b.height>=this.y)){
					this.blood--;
					if(this.blood<=0){
						this.crashed=true;
					}
					b.removable=true;
			}
		}
		if((this.x+this.width>hero.x)
			&&(hero.x+hero.width>=this.x)
			&&(this.y+this.height>hero.y)
			&&(hero.y+hero.height>=this.y)){
				hero.crashed=true;//我方英雄撞毁程序
		}
	}
}
//所有敌机组成的列表
function EnemyList(){
	this.arr=[];//保存所有敌机
	this.add=function(enemy){
		this.arr.push(enemy);//增加新敌机
	}
	this.remove=function(i){
		this.arr.splice(i,1);//删除敌机
	}
	this.draw=function(){//绘制所有敌机
		for(var i in this.arr){
			this.arr[i].draw();
		}
	}
	this.move=function(){//让所有的敌机移动
		this.generate();//生成新的敌人
		for(var i in this.arr){
			var e=this.arr[i];
			e.move();
			if(e.removable){
				this.remove(i);
			}
		}
	}
	//随机生成一个敌机
	var enemyList;
	this.generate=function(){
		 /*敌机生成的要求
			*生成敌机是随机的,不是定时的,或者连续的
			*小号敌机的概率最大,中号随机,大号最少
			*思路:0~99的随机数,如果生成的是   
			*小号:0/1/2/3/4/5/
			*中号:6/7/8
			*大号:9
			*其他值不生成敌机
			*进一步扩展 可以将6/9/10设置为变量,增加游戏难度
		 */
		 var num=Math.floor(Math.random()*3000);//0~300的随机数
		 if(num<60){//随机生成敌机
			 this.add(new Enemy1(imgsEnemy1));
		 }else if(num<90){
			 this.add(new Enemy2(imgsEnemy2));
		 }else if(num<98){
			 this.add(new Enemy3(imgsEnemy3));
			 console.log(this.x);
		 }
	}
}

//绘制当前的分
function drawStat(){
	ctx.font='25px Helvetica';
	ctx.fillStyle="#333";
	//绘制当前的得分
	var score='SCORE:'+heroScore;
	ctx.fillText(score,10,35);
	var heros='HEROS:'+heroCount;
	var w=ctx.measureText(heros).width;
	ctx.fillText(heros,canvasWidth-w-10,35);
}

/***阶段5游戏暂停阶段****/
canvas.onmouseout=function(){
	if(curPhase===PHASE_PLAY){
		curPhase=PHASE_PAUSE;
	}
}
canvas.onmouseover=function(){
	if(curPhase===PHASE_PAUSE){
		curPhase=PHASE_PLAY;
	}
}
function drawPause(){
	var x=canvasWidth/2-imgGamePauseNor.width/2;
	var y=canvasHeight/2-imgGamePauseNor.height/2;
	ctx.drawImage(imgGamePauseNor,x,y);
}
/****阶段6游戏结束阶段***/

function drawGameover(){
	ctx.font='60px Helvetica';
	ctx.fillStyle='#bbb';
	ctx.strokeStyle='#666';
	var txt='GAME OVER';
	var w=ctx.measureText(txt).width;
	var x=canvasWidth/2-w/2;
	var y=canvasHeight/2+60/2;
	ctx.fillText(txt,x,y);
	ctx.strokeText(txt,x,y);
}
/*****游戏的主引擎-主定时器*****/
function startEngine(){
	setInterval(function(){
		sky.draw();
		sky.move();
		switch(curPhase){
			case PHASE_READY:
			       logo.draw();
						 break;
			case PHASE_LOADING:
						 loading.draw();
						 loading.move();
						 break;
			case PHASE_PLAY:
						 hero.draw();
						 hero.move();
						 bulletList.draw();
						 bulletList.move();
						 enemyList.draw();
						 enemyList.move();
						 drawStat();
						 break;
			case PHASE_PAUSE:
						 hero.draw();
						 bulletList.draw();
						 enemyList.draw();
						 drawStat();
						 drawPause();
						 break;
			case PHASE_GAMEOVER:
						drawGameover();
						break;
		}
	},20);//每一秒动24次
}

这就是全部的代码!
下面是进入游戏的地址,可以玩玩!
进入游戏

李东辉

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:37   其中:访客  30   博主  7

  1. avatar 生晓's blog 4

    js大神。

  2. avatar FROYO 0

    大赞,学习

  3. avatar 王静 5

    楼主好,我们可以交换友情链接吗?我的网站http://www.magicessay.org/

  4. avatar 姜辰 1

    很不错的游戏,博主真是厉害

  5. avatar 车况检测 1

    厉害,涨知识了

  6. avatar 第9页 1

    好长的代码啊!原来想打个飞机也不容易!

  7. avatar 一件代发 1

    不是很懂!

  8. avatar 古筝价格 2

    好怀念这个游戏呢

  9. avatar 男孩资源网 5

    文章很好~!赞

  10. avatar 男孩资源网 5

    文章很好~!赞

  11. avatar 男孩资源网 5

    文章很好~!赞

  12. avatar 男孩资源网 5

    文章很好~!赞

  13. avatar 男孩资源网 5

    文章很好~!赞

  14. avatar 男孩资源网 5

    文章很好~!赞

  15. avatar 男孩资源网 5

    文章很好~!赞

  16. avatar 男孩资源网 5

    文章很好~!赞

  17. avatar 男孩资源网 5

    文章很好~!赞

  18. avatar 男孩资源网 5

    文章很好~!赞

  19. avatar 男孩资源网 5

    文章很好~!赞

  20. avatar 男孩资源网 5

    文章很好~!赞

  21. avatar 男孩资源网 5

    文章很好~!赞

  22. avatar 男孩资源网 5

    文章很好~!赞

  23. avatar 小易分享网 5

    不错哦,赞一个,求认识,求回访 http://www.xevip.cn

  24. avatar 奇虎分享网 5

    过来看看你的博客,希望每天都更新一些文章。

  25. avatar LNUHh 0

    万 部 A 片高清 国产日韩 hTTp://T.CN/Rt8jUdO

  26. avatar 北京装修公司 1

    感谢分享 祝您开心快乐每一天
    <a href="http://www.jcsnzs.com/" target="_blank">北京装修公司</a>

  27. avatar VIP灵儿网 5

    今天才发现你的博客,连着看了几篇呢 http://www.viplinger.cn

  28. avatar 整形视频 2

    表示有点看不懂

  29. avatar 小易分享网 5

    不错哦,赞一个,求认识,求回访 欢迎回访:http://www.3gwb.com

  30. avatar www.tmcore.com 5

    过来看看你的博客,希望每天都更新一些文章。 欢迎回访:www.tmcore.com