h5的射击小游戏设计与开发【字数：11945】
摘 要随着现代计算机网络的兴起，我们的生活正在悄然发生着翻天覆地的变化，在这样的大环境下，H5一经发布，给互联网世界带来不小的震动。所谓H5就是html5的缩写，是在网络上通用的一种超文本标记语言，它代表着一种技术规范。而对于H5小游戏,我们可以看作成移动端的web小游戏，H5小游戏最大的优势就是省去了庞大复杂客户端的下载与安装,同时它开发的周期相对较短，后期修改相关代码简便，兼容性强，可跨平台，多渠道，占用系统内存小。这些优势为H5小游戏的传播创造了极大的便利，越来越受人们的欢迎。本课题以Sublime Text3+谷歌浏览器为开发环境，以H5前端技术为主要研究内容，开发基于H5的射击类小游戏。课题实现过程主要包括鼠标事件的处理，HTML本地存储，碰撞检测的实现，各种音效的添加和游戏各个角色的控制等。
目 录
1. 引言 7
1.1 研究背景 7
1.2 研究目的及意义 7
1.3 课题研究带来的影响 8
2. 系统开发环境 9
2.1 开发工具 9
2.1.1 WampServer 9
2.1.2 Sublime Text3 9
2.1.3谷歌浏览器 10
2.2 开发技术 11
2.2.1 HTML5技术概述 11
2.2.2 CSS技术概述 12
2.2.3 JavaScript技术概述 12
2.2.4 PHP技术概述 12
3．概要设计 14
3.1 游戏整体设计思路 14
3.2 游戏角色设计 15
3.2.1 英雄设计 15
3.2.2 怪兽设计 17
3.2.3 子弹设计 17
3.2.4 音效设计 18
3.3.5 按钮设计 20
4. 游戏功能实现 21
4.1 游戏注册登录 21
4.2 游戏场景制作 24
4.3 游戏主循环实现 29
4.4 游戏历史记录 30
4.5 游戏排行榜 32
4.6 游戏记录的清除 34
*好棒文|www.hbsrm.com +Q: ￥351916072$
/> 5. 重要算法实现 36
5.1 碰撞检测 36
5.2 游戏键盘控制 36
5.3 鼠标事件处理 38
5.4 帧动画 39
5.5 HTML本地存储 40
6 游戏说明 41
7.结语 42
7.1 课题总结 42
7.2 展望 42
参考文献 43
致谢 44
1 引言
1.1 研究背景
前几年的微信跳一跳游戏火热的场景将H5小游戏带到了互联网生态的顶端，吸引了大批开发人员来开发H5小游戏。那是因为相对于绝大多数APP，H5技术存在着巨大的优势。H5技术的最大的优点在于其跨平台性，它可以在不同的浏览器端的网页上运行，无需下载客户端，大大提升了开发效率，既减少了计算机程序员的工作量，也大大节约了企业的开发成本。当然，H5还有其它显著的优势，它可以对网页实时更新、实时响应，能够非常快速的满足用户需求，由此可以看出其试错成本很；另外，由于它是一个开源的生态系统，网络上存在着大量开源库可以供计算机程序员使用，这样导致开发更加轻松、方便，敏捷，同时也能大大加快网页的迭代速度，再一次降低企业的开发成本；以及由于现在网络形式多种多样，对于H5网络上导流入口的形式多种多样，其中包括一些应用市场、搜索引擎、主流的APP、浏览器等等流量入口，因此，以H5为基础开发的应用更易于广泛传播以及爆发。其中最为突出的就是H5小游戏，目前H5小游戏的开发技术和产业链已经相当完善，游戏引擎技术也已经趋于成熟，目前市场上面向开发者的三大主流引擎主要包括有Egrat，Cocos，Layabox等。在目前的市场环境下，市场上H5小游戏主要是简单快捷的休闲类H5小游戏。
正是由于H5小游戏的跨平台性和可移植性，使其拥有众多的流量入口，如腾讯的主要聊天工具微信和QQ都早已开方了了H5小游戏的入口。此外拥有大流量的客户端的新浪微博、今日头条等也成为小游戏的重要入口。可见供应的流量渠道是多么的至关重要，H5小游戏的转化率就取决于这些流量入口。目前，对于H5小游戏来说，它的发展具有以下几个趋势：各厂商应该寻找新机会，对H5小游戏的研发投入应该不断增加，因为目前原生APP手游市场竞争格局也已经基本稳定，产品壁垒也越来越高；加大对引擎研发力度，只有引擎向前发展才能够使游戏呈现出更加丰富多样的玩法；重视H5小游戏市场，对H5小游戏大力推广，进行大量购买流量的操作，尽最大限度的去挖掘潜在客户。
1.2 研究的目的和意义
目的：
在21世纪的今天，计算机技术发展异常迅猛，超乎人们的想象。在目前生活节凑也在不断加快的背景之下，人们在闲暇之时，H5小游戏由于操作非常方便快捷，并且无需安装，可以给人们带来一个娱乐休闲的地方，使人们在快节奏的生活之中放松，身心愉悦。
意义：
随着网路和手机技术的发展，H5小游戏已经逐渐成为人们现在打发时间，缓解生活压力，身心放松的一项不可缺少的项目之一。因此，开发玩法多样，情景有趣，画面优美，令人难忘的背景音乐的H5小游戏越来越有意义，它们之中或许哪一天就有可能成为人们热烈讨论的对象。当一个游戏能够将这些兼具艺术性与流行性的元素组合到一起，不仅能够使人们可以从中得到身心放松，或许同时还可能得到一些对生活对人生的领悟。
1.3 课题研究带来的影响
H5小游戏可以让人们在闲暇的时间里放松心情，释放压力，让人们生活在一个相对放松的环境之中，，同时游戏可以多人参与，让人们的交流多了一种方式，增进人与人之间的感情，减少社会犯罪率，促进社会和谐发展。
2 系统开发环境
2.1开发工具
2.1.1WampServer
WampServer是一款在windows环境下能将apache、php和mysql集成在一起的软件包，它方便快捷，只需一键安装，省去了计算机程序员去配置环境的时间，这样能让他们更好地专心于程序开发。本次课题使用WampServer就是因为它能够很方便的将php开发的后台与前端的写入的数据库有机的联合起来，大大提升了程序的运行效率。
/
图21 WampServer的运行界面图
2.1.2谷歌浏览器
目 录
1. 引言 7
1.1 研究背景 7
1.2 研究目的及意义 7
1.3 课题研究带来的影响 8
2. 系统开发环境 9
2.1 开发工具 9
2.1.1 WampServer 9
2.1.2 Sublime Text3 9
2.1.3谷歌浏览器 10
2.2 开发技术 11
2.2.1 HTML5技术概述 11
2.2.2 CSS技术概述 12
2.2.3 JavaScript技术概述 12
2.2.4 PHP技术概述 12
3．概要设计 14
3.1 游戏整体设计思路 14
3.2 游戏角色设计 15
3.2.1 英雄设计 15
3.2.2 怪兽设计 17
3.2.3 子弹设计 17
3.2.4 音效设计 18
3.3.5 按钮设计 20
4. 游戏功能实现 21
4.1 游戏注册登录 21
4.2 游戏场景制作 24
4.3 游戏主循环实现 29
4.4 游戏历史记录 30
4.5 游戏排行榜 32
4.6 游戏记录的清除 34
*好棒文|www.hbsrm.com +Q: ￥351916072$
/> 5. 重要算法实现 36
5.1 碰撞检测 36
5.2 游戏键盘控制 36
5.3 鼠标事件处理 38
5.4 帧动画 39
5.5 HTML本地存储 40
6 游戏说明 41
7.结语 42
7.1 课题总结 42
7.2 展望 42
参考文献 43
致谢 44
1 引言
1.1 研究背景
前几年的微信跳一跳游戏火热的场景将H5小游戏带到了互联网生态的顶端，吸引了大批开发人员来开发H5小游戏。那是因为相对于绝大多数APP，H5技术存在着巨大的优势。H5技术的最大的优点在于其跨平台性，它可以在不同的浏览器端的网页上运行，无需下载客户端，大大提升了开发效率，既减少了计算机程序员的工作量，也大大节约了企业的开发成本。当然，H5还有其它显著的优势，它可以对网页实时更新、实时响应，能够非常快速的满足用户需求，由此可以看出其试错成本很；另外，由于它是一个开源的生态系统，网络上存在着大量开源库可以供计算机程序员使用，这样导致开发更加轻松、方便，敏捷，同时也能大大加快网页的迭代速度，再一次降低企业的开发成本；以及由于现在网络形式多种多样，对于H5网络上导流入口的形式多种多样，其中包括一些应用市场、搜索引擎、主流的APP、浏览器等等流量入口，因此，以H5为基础开发的应用更易于广泛传播以及爆发。其中最为突出的就是H5小游戏，目前H5小游戏的开发技术和产业链已经相当完善，游戏引擎技术也已经趋于成熟，目前市场上面向开发者的三大主流引擎主要包括有Egrat，Cocos，Layabox等。在目前的市场环境下，市场上H5小游戏主要是简单快捷的休闲类H5小游戏。
正是由于H5小游戏的跨平台性和可移植性，使其拥有众多的流量入口，如腾讯的主要聊天工具微信和QQ都早已开方了了H5小游戏的入口。此外拥有大流量的客户端的新浪微博、今日头条等也成为小游戏的重要入口。可见供应的流量渠道是多么的至关重要，H5小游戏的转化率就取决于这些流量入口。目前，对于H5小游戏来说，它的发展具有以下几个趋势：各厂商应该寻找新机会，对H5小游戏的研发投入应该不断增加，因为目前原生APP手游市场竞争格局也已经基本稳定，产品壁垒也越来越高；加大对引擎研发力度，只有引擎向前发展才能够使游戏呈现出更加丰富多样的玩法；重视H5小游戏市场，对H5小游戏大力推广，进行大量购买流量的操作，尽最大限度的去挖掘潜在客户。
1.2 研究的目的和意义
目的：
在21世纪的今天，计算机技术发展异常迅猛，超乎人们的想象。在目前生活节凑也在不断加快的背景之下，人们在闲暇之时，H5小游戏由于操作非常方便快捷，并且无需安装，可以给人们带来一个娱乐休闲的地方，使人们在快节奏的生活之中放松，身心愉悦。
意义：
随着网路和手机技术的发展，H5小游戏已经逐渐成为人们现在打发时间，缓解生活压力，身心放松的一项不可缺少的项目之一。因此，开发玩法多样，情景有趣，画面优美，令人难忘的背景音乐的H5小游戏越来越有意义，它们之中或许哪一天就有可能成为人们热烈讨论的对象。当一个游戏能够将这些兼具艺术性与流行性的元素组合到一起，不仅能够使人们可以从中得到身心放松，或许同时还可能得到一些对生活对人生的领悟。
1.3 课题研究带来的影响
H5小游戏可以让人们在闲暇的时间里放松心情，释放压力，让人们生活在一个相对放松的环境之中，，同时游戏可以多人参与，让人们的交流多了一种方式，增进人与人之间的感情，减少社会犯罪率，促进社会和谐发展。
2 系统开发环境
2.1开发工具
2.1.1WampServer
WampServer是一款在windows环境下能将apache、php和mysql集成在一起的软件包，它方便快捷，只需一键安装，省去了计算机程序员去配置环境的时间，这样能让他们更好地专心于程序开发。本次课题使用WampServer就是因为它能够很方便的将php开发的后台与前端的写入的数据库有机的联合起来，大大提升了程序的运行效率。
/
图21 WampServer的运行界面图
2.1.2谷歌浏览器
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jsj/qrs/64.html
