论文-基于HTML5的消除类游戏

1、-*大学本科生毕业论文设计基于HTML5的消除类游戏 指导教师：所在学院：专业系：班级届：二 * 年 * 月 * 日. z-目 录中文摘要、关键字11 引言21.1 研究背景21.2 研究现状21.3 研究目的31.4 本文主要容32 研究技术分析42.1 HTML5简介42.2. 游戏引擎42.3 开发环境53 工程的设计与开发 63.1 游戏玩法63.2 需求分析63.3 初步设计63.4 游戏开场流程73.5 局部程序界面与实现94 总结144.1 工程学习阶段总结144.2 工程实施阶段总结154.3 扩展知识15致 17参考文献18英文摘要、关键字19. z-基于HTML5的消除类游

2、戏 软件学院 软件工程专业指导教师 *作 者 *摘要：近几年来社会不断地快速开展，也让人们在工作中产生了很多这样那样的压力，随着科技的进步，人们更希望通过网络、通过游戏来释放自己的压力，以往的技术都只是让游戏在笔记本或者移动产品上单独运行，并不可以跨平台操作，这也增加了开发者的工作量，因此经过人们不懈的努力，终于在原有根底上对html进展了改革，这就是HTML5。HTML5具有很多新的特性，最主要的还是它具有跨平台兼容性，不仅可以在电脑上运行，还可以在移动终端运行，不仅如此HTML5中的Canvas元素可以使浏览器直接创立并处理图像，减轻了开发人员的负担，而且使界面更加美观，具有很好的用户体验

3、。减少了用户刷新页面的时间，得到了更多人的认可,因此基于HTML5所制作的游戏也就成了很多人的研究课题。本文通过介绍HTML5的一些特性，以及对游戏引擎的学习，比方cocos2d,unity3d等的认识，并通过当下比较流行的消除类游戏的研发过程分析来使HTML5的容更加形象，并对HTML5的前景做了一些分析。 关键词：HTML5 Canvas 游戏引擎 cocos2d unity3d. z-1 引言1.1 研究的背景当今社会，随着经济的不断开展，人们对精神领域的追求也在不断加强，人们不再满足于只在笨拙的台式机上进展工作，而是越来越倾向于使用移动电子产品，并且人们对于网页的设计，刷新的速度都有了

4、更高的要求，在这样的一个时代要求下，以前的网页制作语言HTML已经不能满足人们的要求，需要在移动、跨平台等新特性下研发更新html语言。1先前的几个html版本，主要针对的是静态的文本网页，用于显示文档和共享一些数据，后来动态和应用程序的出现，使得网页更具有灵动性，但是这些都是基于第三方的插件或者Adobe Flash来完成的，这些插件可以使更加丰富，可以提供人机交互的功能。随着网店和网页游戏的不断兴起，Web早就不能只满足于静态的文档，但是Web本身又不具备对视频，音频，图像处理的开发功能，想要在网页中添加这些就必须借助第三方插件，另外有时还需要其他的技术来支持HTML，让它支持多种媒体，这

5、就加重了开发人员的工作量，不仅如此，人们再刷新网页时由于容过多，消耗时间较长，用户体验差。因此通过不懈的努力，HTML5终于应运而生。1.2 研究的现状HTML5对旧的Web网页制作技术做了大量的改进、创新。它增加了很多新的元素，将一些模块动态化，另外HTML5的核心目标是增加了比方<audio>、<video>等新的媒体元素，这样就可以不用第三方插件来播放多媒体，操作更加简单方便。不仅如此新增加的Canvas元素，可以使浏览器直接创立并处理图形，使得网页布局更加美观大方，也方便了开发人员，代码更加简洁。HTML5不仅是对互联网的改革，它更增加跨平台性，兼容性更好，它将

6、互联网带向了一个更加成熟的平台，使用HTML5开发的程序，不仅可以在电脑上运行，同样人们也可以在移动产品上使用程序，人们获取信息更加方便，快捷。大大的满足了人们对了解各种信息的迫切要求，无论是查看文档信息，还是加载动画、视频，都增加了页面的刷新速度，具有良好的用户体验。HTML5新增加的这些功能，也为网页游戏提供了开发上的便利条件，不再需要第三方插件来支持游戏的音效，动画，给网页游戏开创了一个新的时代。在国外也掀起了一股学习开发HTML5游戏的热潮，之前的网页游戏开发本钱高，即需要效劳器端有需要客户端的支持，而现在HTML5可以跨平台操作，可以在更多的移动产品上进展操作，更能满足人们对于便捷的

7、要求。同时开发者只需要在原有根底上了解一下增加的新的HTML5和JS语言，当然对于游戏少不了的还有各种引擎，这些会在后面的文章中有所涉及。1.3 研究的目的由当前的游戏开发趋势来看，以后将会是HTML5的时代，当刷新HTML5的游戏时会像刷新页面那样简单，而且它的所有技术都是开放性的，方便开发者学习和应用。为使用者提供了更加精巧的动画效果，这对有游戏的设计来说至关重要，很多游戏能够得到人们的广泛关注除了玩法新颖意外，那就是画风优美，让人赏心悦目，这也是HTML5游戏的独特之处。但是毕竟HTML5是基于浏览器的语言，所以由此开发的游戏也是轻量级的小游戏，随着移动电子产品的多元化，人们更希望通过游

8、戏来释放自己在工作学习中的压力，虽然HTML5不能制作大型游戏，也因此游戏种类千变万化，丰富了人们的生活，不至于再长时间万同一款游戏时觉得枯燥无味。这也为游戏开发者和供应商提供了更多的时机。此外HTML5还提供了诸如重力感应，离线地图、多点触控等其他的交互应用功能。无论是对于游戏还是来说都是一次质的飞越，而作为一个具有探索，好奇心的软件学生来说，学习HTML5必将对自己以后进入社会，对自己以后的工作有所帮助，不断学习新的技术，跟上时代的潮流，这是我们当代大学生的重要职责。本文通过对HTML5进展短暂的学习之后，完成了对HTML5的小型的实践游戏，来稳固对学习容的理解，找到了网页与游戏的相当好的

9、契合。1.4 本文主要容首先使用了HTML5新添加的<audio>元素标签，对音频进展添加，不再借助第三方软件，方便了我们的编程，只需添加相应的声音文件即可，代码减少了很多，也表达了在各浏览器中的兼容性。而且我们还可以隐藏播放时的界面，这样就不会影响界面的美观了。音频功能是有了新的标签，则人们更多的是注重视频的添加不再则麻烦，针对这一点HTML5也为此创立了<video>元素标签，使得视频的添加不再过于繁琐，代码也不再过于臃肿。很多人认为视频要比音频的添加困难，因为视频还包括了图像，但是对于HTML5来说只需要一个标签而已，与音频的添加完全相似。对于游戏来说最主要的就是

10、界面要美观，这就要说到我们HTML5最主要的新元素<Canvas>了，通过Canvas你可以创立绚丽的图形和游戏界面，不仅如此你还可以通过JavaScript API来控制Canvas进展交互应用，产生动态的图画，动态的更新数据。不再借助第三方的Flash软件来显示动画，还可以自定义动画容，方便快捷。HTML5还可以进展本地存储，这个新的功能可以用来存储分数或者是玩家的排行榜。尽可能的使用新的特性标签来设计实现游戏的根本功能。2 研究技术分析2.1 HTML5简介HTML5是万维网html语言的第五个版本，目前比较流行的版本是HTML4.01，虽然相较先前的版本有了很大的改善，但是

11、随着移动应用的开展，以前的那些版本已经远远达不到人们对于科学技术的要求，Html需要在包括语言方面，语法方面和UI、API等各方面的更新，因此就产生了现在这个新的版本。在HTML5之前人们更注重用html来制作一些静态的网页，那时候人们通过网络的交互还不是则兴旺，从网络上了解外界信息的心情也不是则迫切，博客，网店也没有兴起。但是近几年随着科技和经济的不断开展，人们更倾向于从网上获取信息，在网上购置商品，节省了人们很多的时间与精力。因此再2021年HTML5正式被大家所认可，实现了Web领域近十几年来质的飞跃，将Web推向了一个更高、更成熟、更稳定的平台。3在此根底上HTML5将音频，视频，动画

12、等容融为一体，更是增加了很多新的元素标签，去除了一些繁琐，冗长的标签，将一些相似标签融为一体，比方增加了表单验证标签，节省了表单输入时的麻烦，这些新的标签是网页构造更加紧凑合理。比方hgroup可以将标题进展分组，合成一个个的整体，使开发页面也更加整洁；还有新添加的导航标签nav，有利于搜索引擎的结果整理。HTML5相较其他版本的以大亮点就是将audio和video引入到标签中，这样网页播放音频和视频时就不必借助第三方插件，本身就可以做到了。当然对于游戏来说最主要的还是图形动画的界面要美观，这样才可以吸引更多的人来玩，对于这方面不得不提的就是Canvas标签了，它与其他元素不同，不像audio

13、等元素直接将现有元素插到网页中，而是可以独立的处理或创立2D图形，不仅如此，还可以通过JavaScript语言来控制Canvas的图形来响应与用户交互的动态图形与动画。2.2 游戏引擎介绍完了主要的开发语言平台，那开发过游戏的人都应该了解，开发一款游戏最重要的莫过于引擎了，下面我将介绍一下本次研究课题中所使用到的引擎。游戏引擎是整款游戏的核心，是游戏的心脏，它提供很多种模板供开发者使用，使游戏设计者不必从零开场，就已经有可用的人物，工具等，减轻了开发者的工作量，也降低了学习游戏开发的门槛。一般的游戏引擎包括渲染、场景、摄像、脚本、物理因素重力、摩擦等、碰撞检测、音效等系统，游戏玩家所体验到的关

14、卡、剧情、玩法等都由引擎来控制，它在整个游戏中扮演着发动机的角色，为整个游戏提供动力，也扮演着幕后角色，在后台指挥者游戏的进程。一款完整的游戏包括游戏资源如声音、图片等和游戏引擎共同组成，缺一不可。随着游戏种类的不断增加，游戏引擎也是多种多样，一般分为2D引擎和3D引擎，其中2D的引擎又有不同的种类比方cocos2d、Bo*2D、gamemark、untiy2d等，3D的游戏引擎包括Unity3D、away3D、wolfenstein3D engine、Panda3D等各种各样的引擎可以写出风格各异的游戏，丰富了人们的精神世界。本文所列举的实例游戏采用的是cocos2d-html5的游戏引擎，

15、这款引擎主要针对用HTML5来编写的游戏，cocos2d-html5包括了导演、场景、布景、摄像机、人物、动作等主要的概念。导演是整个引擎或者是整个游戏的总指挥，它控制着其他的控件，比方人物该有什么样的动作，有什么样的语言等等，总之其他的事物都要服从导演的指挥；场景和布景主要是负责游戏的背景以及各关卡之间的转换作用，是人们对于一个游戏的第一印象；摄像机是将人物或场景的转换记录下来，连成一段合理的故事；人物和动作也是游戏的灵魂，这里的人物又叫做精灵，其实并不是单纯的指人，也可以是方块等其他的物体，就是给这些精灵附上了动作，才使游戏有了动态的效果。这些概念相互依存，相互关联、必不可少，少了任何一项

16、整个游戏都会坍塌。4Cocos2d-html5还支持跨平台操作，这也符合了HTML5的新的特性，不仅支持浏览器使用，还可以支持移动应用，让人们随时随地尽情玩耍，现在随处可见拿着移动产品不断玩游戏的人们，不过现在大局部游戏还是用android或Ios语言来写的，我相信随着HTML5的不断开展，将来会有更多的游戏是可以跨平台的，更能满足人们对不同游戏的渴望。2.3 开发环境综合开发工具，网上对于cocos2D的开发工具有很多种，我所选择的开发工具是webstorm,这款工具使用方便，只需要将下载好的cocos2D引擎加载到工具中即可。WebStorm是一款基于javascript语言的开发工具，被

17、称为“最强的HTML5编辑神器，它集成了多种模板方便人们开发，还具有拼写检查，重复代码检查，语言分析，智能补全代码，它不仅可以支持不同的浏览器，还支持自定义函数，代码格式化，联想查询，代码调试，代码构造调试、重叠等功能。使用和安装过程相当方便。根本界面如以下图：图2.3 界面所使用javascript框架是Jquery,Jquery是一款轻量级的语言框架，它不仅兼容CSS3，而且还兼容各种浏览器如火狐，IE，opera，它有一个比其他框架更好的特点，那就是它的文档说明非常全，便于开发者自己学习，同时也提供了很多成熟的插件，还可以将程序代码和html容分开来写，不至于看起来很混乱。Jquery是

18、一款免费，开放的javascript框架，它的语法设计方便了人们的开发与学习，同时它还提供了API，开发者可以自己编写自己想要的插件，主要的是它可以为游戏提供动态特效。2在游戏调试过程中，采用的是火狐浏览器，因为这是一款主流浏览器，这样也方便了开发者的调试，一般经过调试后，再在其他浏览器上运行时也不会有什么大的问题。3 工程的设计与开发3.1 游戏的玩法现在有很多的消除类游戏，而我们所实现的这类游戏应该是玩法最简单的一种，这款消除类游戏是当下比较流行的星星消除，是一款很容易让人着迷的游戏，点击开场后，通过快速点击两个或者两个以上的靠在一起的方块，实现快速消除，每消除一次方块就会得到相应的分数，

19、每一关都会有一个通过本关的目标分数，当你的分数大于或等于目标分数，并且没有可以再在进展消除的方块时，本关游戏通过，最后如果剩余的星星数小于10的话，则可以得到额外的奖励，所以要争取赚的更高的分数，才可以一直进展下去，如果有一关，你并未到达目标分数，那游戏就完毕了。3.2 需求分析游戏用户包括开发者和游戏玩家。游戏玩家通过浏览器翻开游戏，点击开场按钮，开场游戏。根据游戏提示的玩法开场游戏，并且随时查看自己的得分情况。玩家用例分析如以下图：图3.1 用例分析3.3 初步设计首先先设计游戏界面，界面是游戏给玩家的第一印象，对于本工程实例来说大致可以分为游戏前台和游戏后台。前台负责游戏的界面与承受玩家

20、发出的指令，前台还负责游戏音效，游戏初始化以及将玩家的单击双击触发事件发送给后台，并承受后台所发送的分数数据。后台则负责处理数据，将数据反响给前台，还负责将玩家的得分情况排行情况输入数据库中。模块功能图如下：图3.2 功能设计游戏界面设计是一个10*10的方块矩阵，这个矩阵可以根据自己的喜好自定义更改矩阵的数量，当游戏玩家消除方块后，在游戏引擎的控制下，方块会自动下落，更改自己的位置；前台的界面还提供了音效控制按钮，因为并不是每一个人都喜欢玩游戏的时候有音乐，可以根据个人喜好控制背景音效，不同的事件触发会产生不同音效。开发游戏最重要的一项就是游戏引擎，在前台进展碰撞检测，以及其他的物理引擎检测

21、，将数据或者事件的接口传回后台，后台进展处理后，将结果返回前台，前台根据处理结果，改变场景。3.4 游戏开场流程前台局部用户使用浏览器翻开游戏，既可以开场游戏，游戏开场流程如以下图：图3.3 流程图后台流程包括数据的接收与发送，以及与数据库的交互行为，将前台检测到的行为进展处理。简易流程图如下：图3.4 后台流程图3.5 局部程序界面与实现开场界面只需要接收按钮的点击事件，游戏首页最主要的应该是有好的用户体验，有一个美观大方的页面，现在玩游戏的不仅是儿童，更多的是那些忙碌了一天的白领用来释放压力，放松身心的最有效的方法，所以界面要美观大方。对于首页，我们既可以使用CSS来美化页面，也可以使用H

22、TML5最新的标签Canvas来渲染界面，最终首页局部代码：Ltotype.onStartClicked = function () this.newGame.runAction(cc.ScaleTo.create(0.2, 1.3); cc.BuilderReader.runScene(", "MainLayer");/开场界面的场景创立Ltotype.createBgParticle = function (*, y, n) var background = cc.ParticleSystem.create("Re

23、sources/bg/" + n + ".png");background.setAnchorPoint(cc.p(1, 0.5);background.setPosition(cc.p(*, y); background.setZOrder(10); this.rootNode.addChild(background);/初始化背景接下来进入主场景界面，其中局部代码如下：MainLtotype.getRandomStar = function (col, row) this.starSize = 75; var stars = PS_MAIN_T

24、E*TURE.STARS; var randomStar = starsgetRandom(stars.length);/随机产生星星 var starSprite = cc.Sprite.createWithSpriteFrameName(randomStar); starSprite.setAnchorPoint(cc.p(0.5, 0.5);/设置星星的位置 starSprite.setPosition(cc.p(36 + colInde* * this.starSize, 1300); starSprite.starData = n: randomStar, inde*OfColumn

25、: col, inde*OfRow: row;/布置星星群 starSprite.setZOrder(100); var flowTime = row / 10; var fallAction = cc.MoveTo.create(flowTime, cc.p(36 + col * this.starSize, 36 + row * this.starSize); starSprite.runAction(fallAction); return starSprite;/在这一局部主要是先建立一个主要场景，添加随机掉落的星星的位置。然后再在已有位置上绘制一个10*10的星星群，for (var

26、i = 0; i < this.num*; i+) var sprites = new Array(this.numY); for (var j = 0; j < this.numY; j+) var pSprite0 = this.getRandomStar(i, j); if (pSprite0 != null) this.rootNode.addChild(pSprite0); spritesj = pSprite0; /添加星星群。到这里，这个游戏的根本雏形已经完成，因为本文只是大概的介绍一下整个游戏制作过程中局部代码，所以这里主要介绍的是JS的局部控制代码。游戏中的算法分

27、析，每一颗星星添加单击事件，在此局部需要判断一下碰撞检测，当点击任何一个星星时，第一次单击是选中星星，并判断一下，与它相邻的周围是否有与它一样的星星，如果有则全部选中，并进展第二次单击消除星星，通过语句可以判断出是第几次单击事件，如果它的值小于1，那就表示是第一次单击事件，就检测一下是否有颜色一样的区域；如果它的值大于1，那就表示是第二次单击事件，这时候就要判断是否点击的是同一个星星，如果是那就进展消除操作，操作主要语句是this.removeSameColorStars()，当消除星星时，还应该添加上声音，语句为cc.AudioEngine.getInstance().playEffect(

28、PS_MAIN_SOUNDS.broken, false)。第二步就是要检测一下所选中的星星周围是不是有一样的颜色的星星，如果有，那就将它们放到同一个数组中去，如果数组的长度大于1，则说明周围有一样的星星。在这只举一个例子，比方左面：var fourSideSpriteList = ;/创立数组变量。 var color = sprite.starData.color; var col = sprite.starData.inde*OfColumn;if (col > 0) var left = this.starTablecol - 1row; if (left != null &am

29、p;& left.starData.color = color) fourSideSpriteList.push(left); /判断左边的相邻星星是否颜色一致。在玩游戏的过程中，你会发现，但你选中星星后，一样颜色的会有一片，会自动判断每一颗选中的星星的一样颜色，这就用到了this.sameColorList和newSameColorList这两个数组，第一个数组判断的是当前选中的星星的相邻一样颜色，第二个数组判断的是新选中的延伸出来的星星是否颜色一样。当将上述语句判断完成后，就是要进展消除工作了，不仅要让星星消除，还应该加上一些动画效果，有助于用户体验，主要语句var simpleS

30、tar = this.sameColorListk;/K为颜色的变量小于颜色数组长度var col = simpleStar.starData.inde*OfColumn;var row = simpleStar.starData.inde*OfRow;/创立行和列的变量this.starTablecol.splice(row, 1, null);/边界星星位置this.rootNode.removeChild(simpleStar);/删除颜色一样的星星当产生空余空间时，利用引擎的重力和碰撞检测功能将剩余的临近的星星填充到空余空间，重复这样的动作，只到最后不再有2个或2个以上的一样星星存在时

31、，然后再判断一下所得分数是否已经超过或等于目标分数，如果超出则进入下一关，否则游戏完毕。在游戏中人们最关注的莫过于分数了，星星消除的记分规则如下，在主函数中创立一个Score变量，开场值为0，当你只能消除2颗星星时获得20分，消除3颗星星时获得45分，消除4颗星星时获得80分，以此类推，消除的星星数越多，得到的分数就越多，当最后没有可以消除的星星时，剩余的星星会自动消除，如果剩余星星数小于10，则会有额外的加分，所得分数是将这两者相加，判断最后是否超过目标分数，目标分数也会随着关数的增加而增加，这样也挑战着人们的极限，促使人们不断的刷新自己记录。最终游戏界面如以下图所示：图4.1 开场界面点击

32、新游戏界面进入初始化的星星群界面：图4.2 星星群界面选中星星界面：图4.3 选中界面游戏进展中画面：图4.4 进展中的界面4 总结4.1 工程学习阶段总结经过了一段时间的学习和时间之后，使我更加深入的了解了HTML5 的各个新的特性，通过使用HTML5和javascript语言编写的这个程序，我明白了如何独立自主的学习一门新的语言，当然只有理论知识还不够，计算机软件就是一个需要不断探索，不断实践的科学，当人们意识到先前的html语言已经不能满足人们的要求时，不断创新，不断进取，不断挑战着自己的极限，也就有了HTML5的诞生。HTML5将网页开发带入了一个新的时代，摒弃了一些其他版本中繁琐的标

33、签，又为网页注入了新的能量，HTML5所制作的不仅是支持多种浏览器，还具有跨平台性，也为网络游戏提供了更多的平台，而且具有较高的平安性和良好的用户体验。现在各大公司纷纷转向了HTML5的研究方向，这也就预示着它将有一个良好的开展前景，它将人们的视线从网络浏览器带向了移动应用，它将横跨多个智能平台。虽然HTML5刚刚问世，一些资料还不健全，但是作为一个当代大学生来说，我们更应该努力学习先进的技术，将理论与实践相结合，不能完全依赖与已有的资料，要通过自己的不断摸索完善HTML5，因此才规定HTML5的技术要绝对开源，供大家讨论分享，提出更多的意见，使得HTML5更加强健。随着移动应用的不断增长，移

34、动游戏也越来越受到人们的追捧，游戏引擎也会越来越多，这样人们再开发游戏时就会省去一大局部的时间，减少工作量，游戏的更新换代速度也会增加。4.2 工程实施阶段总结在工程实施阶段，首先要做好游戏的分析工作，可以先借鉴一下别人成功的案例，具体情况具体分析，做好需求分析，如果遇到自己解决不了的问题应该及时向教师或他人请教，毕竟HTML5是一种新的语言形式，又加上从未接触过的游戏引擎，虽然说这次的任务难度有点大，但是只要用心学习，虽然称不上完整无缺的游戏，但是最终也是完成了任务。虽然游戏很小，但是也包含了两大块重要的容，不得不在原有根底上，给自己注入新的血液，观看理论知识，觉得还可以，当真正的开场一个小

35、的Demo时，才发现原来实践起来是则的困难。就拿HTML5的新增标签Canvas来说，以前只使用过CSS来渲染页面，当时就觉得不太好用，因为不同的浏览器会产生不同的效果，你需要在不同的浏览器上不停的调试，兼容性很不好。而且如果想要在页面上播放视频 、音频你必须借助第三方的插件才可以，但是HTML5的Canvas本身就可以借助javascript语言来到达动画的效果，不需要任何的第三方插件，本来以为可以很轻松的搞定它，但是Canvas并不像flash那样好控制，因为它全部是用语言来控制的，不像flash有一个友好的界面，方便调试。虽然有些小的问题存在，但是这并不影响HTML5的实用性，使用HTM

36、L5开发游戏更加方便快捷。4.3 扩展知识HTML5最吸引游戏开发者的地方就是，它具有跨平台性，无论是PC还是Andoid系统，亦或是苹果系统，使用HTML5开发的游戏都可以运行在这些平台上，大大减少了开发者的工作量，只要在一款平台上制作的游戏，其他平台可以直接使用一样的代码，方便游戏的及时更新。用户无论是在电脑上还是在移动电子产品上都可以玩到一样的游戏，甚至是可以联网操作。跨平台的兼容性有好处也有害处，当你设计了一款游戏开场只打算在电脑上玩时，为这款有添加了漂亮的界面，完整的音效，如果你想把它转移到其他平台时，虽然可以转移，但你必须根据不同的平台，做一些相应的调整，并不是说可能是代码的问题，

37、只是你应该也要考虑硬件，是否支持，如果你直接转移应用，或许效果并不会很好。现在的HTML5还在开展当中，所以说不可以以偏概全，虽然跨平台是它的一大亮点，但目前技术还不是很兴旺，会产生一些碎片，比方界面动画不完整，触摸事件无法响应等问题。因此，跨平台的研究还需要不断创新，不断改革，争取早日实现真正的跨平台操作，减轻开发人员的工作量，为游戏玩家提供更多更好的游戏，让人们随时随地都可以尽情的玩自己喜欢的游戏。致 四年的大学生活即将完毕，在最后这半年最重要的事情就是毕业设计和毕业论文的撰写，在我进展毕业设计，撰写论文其间，我的指导教师*教师给予了我很大的帮助，在我遇到不懂得问题时教师耐心的教导，指点我

38、，及时纠正我再设计和论文上的缺乏之处。大二时期*教师就给我上过课，那时候就觉得教师在治学上很严谨，耐心的指导我们，直到将我们的问题教会，在我编写论文期间，教师有为我提供了很多资料，也很热心的和我探讨不明白的地方。从开场到论文的完成，教师都是不辞辛苦的为我解答，占用了教师很多珍贵的时间，在此我向*教师表示万分的感。您所教会我的不仅是知识，还有您待人接物的道理，作为您的学生让我受益一生。还要感那些与我并肩作战的同学们，是你们和我一起讨论资料，研究课题，并且指出我再设计或者其他方面的缺乏，我们共同成长，共同进步。以及以前带过我的教师们，您们用专业的知识教育我，有的教师有时甚至都顾不上吃饭，也在为我们

39、答疑解惑，您们这种精神感染着我，为我走进社会奠定了良好的根底，在此向我的同学们和辛勤工作的教师们报以衷心的感，感你们成就了今天的我。当然还有那些热心的网友，虽然我们素不相识，但你们却给予了我真诚的帮助，在论坛上积极为我解答问题，积极的给我提供各种各样的资料，在我的论文完成之际，也向你们表达我真诚的感。我相信有了大家的帮助，我以后一定可以很快的融入社会，在自己的领域上不断创新，再次感大家的帮助。参考文献1 Peter Lubbers美，Brian Albers 美，Frank Salim美著，杰，柳靖，淼译.HTML5高级程序设计M.，人民邮电，2021.2 ChristianHeilmann德著.牛海彬译.深入浅出JavaScriptM.,人民邮电,2021.3Rob Hawkes英著，周广新，曾少宁，盛海艳译.HTML5 Canvas根底教程M.，人民邮电, 2021.1.4满硕泉著.Cocos2D-*权威指南M.，机械工业，2021.4. z-The elimination game