飞机大作战游戏 2----（运用H5和Js制作）

游戏加载中状态

游戏加载中的图片

用一个数组将图片装起来

var loading=[];loading[0]=new Image;loading[0].src="img/game_loading1.png"loading[1]=new Image;loading[1].src="img/game_loading2.png"loading[2]=new Image;loading[2].src="img/game_loading3.png"loading[3]=new Image;loading[3].src="img/game_loading4.png"

定义一个对象储存图片的数据

var Loading={img:loading,length:loading.length,width:186,height:38}

使用构造函数绘制加载中的图片

函数中需要定义一个索引，再用paint的方法绘制图片，

在step的方法中让索引每次都加1，让图片产生变化，当索引值对于数组的长度时将游戏状态定为RUNNING

function jz(ld){this.img=ld.img;this.length=ld.length;this.width=ld.width;this.height=ld.height;
//               定义一个索引,方面查找图片this.starindex=0
//               绘制图片的方法paintthis.paint=function(){context.drawImage(this.img[this.starindex],0,HEIGHT-this.height);}
//              运动的方法stepthis.time=0this.step=function(){this.time++if(this.time%3==0){this.starindex++}if (this.starindex == this.length) {start=RUNNING}}}

 创建运动图片的对象

 var sky1=new jz(Loading)

给canvas绑定点击事件
   当点击画布界面是进入START状态    

  canvas.οnclick=function(){if(start==START){start=STARTING;}}

定时器调用paint和step方法

转载于:https://www.cnblogs.com/xuhanghang/p/10116043.html

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！