html5小游戏源码大全 html小游戏源代码

玩法说明:上下左右控制移动,空格发弹。 每打中一个敌机就加100分,每提升5000分,玩家的飞机的一次发弹数就加一,最多四,被敌机撞到或者让敌机飞到底部就算输。。。。

演示代码:http://demo.jb51.net/js/FlyBeat/index.html

游戏目前的功能还是比较简单的。。。。貌似就贴个源码不太好,所以这次还是写写思路。。。

游戏主要分为4个js文件,4个js文件分别包含4个类。

1:飞机类---Flyer

复制代码 代码如下:

以上是飞机应该有的属性。。。。

飞机除了有固定的一些属性之外,其实还应该有血量这些的,但这个是简陋版嘛,你可以自己添加。

更应该会有移动,发射子弹,爆炸等方法。

移动: 其实就是捕获键盘事件,如果是简单的按下键盘的左,然后飞机就向左移动几个像素,你会发觉,飞机移动起来很生硬,或者说是操作延迟,特别是你想按住键盘左的时候,它移动的时候,延迟得很严重,操作不流畅。所以一般都是:当你按下键盘时,调用一个setInterval函数来让飞机不断的移动,当释放键盘的时候,移动停止,这样移动就很流畅了。

发射子弹: 其实就是用户按了空格,然后触发一个键盘事件,此事件就是生成一个子弹Bullet类的对象,然后让它飞出去。此类后面会有说到。

爆炸: 当飞机撞到敌机的时候,飞机就会触发一个爆炸事件,结束游戏。当然,这个检测飞机是否撞到敌机,是在敌机那里检测。

这些是一些基本事件。还有扩展的事件。。可以自己添加

2:子弹类--Bullet

复制代码 代码如下:

子弹最基本的两个方法:移动与检测是否打中敌机

移动:子弹的移动简单很多,就一直往上跑,top一直减就OK了。

检测是否打中敌机:将敌机的列表传进方法中,遍历敌机,检测子弹与敌机是否有碰撞,有则敌机爆炸,没有则跳过。

3:敌机类--Enemy

复制代码 代码如下:

敌机的基本方法有:移动,是否撞到飞机Flyer玩家,爆炸

移动:就是敌机如何移动,我是设置成敌机从上到下飞,让后从左往又飞,撞到右边尽头,调头飞。

是否撞到飞机Flyer玩家:在敌机不断的移动过程中,不断的检测飞机Flyer与敌机是否有交集,有则两者爆炸,游戏结束,否则跳过。

爆炸:就是敌机被子弹打中或者撞到飞机Flyer时触发的事件。

4:游戏控制类--Game

其中包含一个扩展方法:从数组中删除指定元素

复制代码 代码如下:

其余的,都是些初始化敌机,飞机以及控制游戏流程的,还有一些修改分数,游戏结束之类的方法。这些没啥好讲。

大致就这样,游戏本身比较简单,下面的源码都有注释,这次写得比较详细。。。有兴趣的朋友,可以自己继续完善。。。有啥问题,欢迎拍砖。。。多多指教。

本文章为转载内容,我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题,欢迎原作者联系我们进行内容更正或删除文章。

收藏 评论 举报

相关文章

相关知识

直接上源码教你做经典HTML5小游戏
html5小游戏源码大全 html小游戏源代码
游戏程序开发,游戏源代码,网页小游戏源码
游戏代码,小游戏开发,游戏源代码
又是一个小游戏――数码游戏 的源代码,大家边玩边学吧!
java 小游戏程序源码 各种经典java小游戏源代码
游戏软件开发,小游戏代码,游戏源码网站
游戏程序开发,手游源码,小游戏代码
36个超有趣的python小游戏‼️附源码
解析“吃豆人”HTML小游戏,附赠免费完整代码

网址: html5小游戏源码大全 html小游戏源代码 http://www.hyxgl.com/newsview370797.html

推荐资讯