《HTML5 2D游戏编程核心技术》——第3章,第3.10节小结

3.10 小结
视频游戏最重要的地方是图像和动画。在本章中,我们一起学习了如何使用HTML5 canvas元素绘制图形和图像,了解了如何使用包装在requestNextAnimationFrame() polyf?ill中的requestAnimationFrame()函数来实现对时间要求较高的动画帧绘制,而不是使用传统的setTimeout()函数和setInterval()函数,因为它们不适合用于动画制作。
本章还介绍了如何通过持续地平移canvas元素绘图区域的坐标系,来产生明显的运动效果。尽管本章讨论的坐标系平移仅限于水平滚动,但可以很容易地扩展本章中的代码来完成垂直方向的,甚至是两个方向的滚动。
视频游戏中的物体不应该因为潜在帧速率的改变而简单地减速或者加速,因此本章介绍了如何实现基于时间的运动,也即运动严格基于时间,而非依赖于当前的帧速率。
最后,本章介绍了如何通过使前景物体比后景物体移动快的方法,来产生视差假象。

时间: 2024-09-17 04:42:53

《HTML5 2D游戏编程核心技术》——第3章,第3.10节小结的相关文章

《HTML5 2D游戏编程核心技术》——第1章,第1.1节Snail Bait游戏

本节书摘来自华章出版社<HTML5 2D游戏编程核心技术>一书中的第1章,第1.1节,作者[美] 戴维·吉尔里,更多章节内容可以访问"华章计算机"公众号查看. 第1章 概 述 令人激动的是,开发人员可以使用软件开发技术使屏幕上出现任何想象的场景.与其他领域受一些物理条件的束缚不同,开发人员长期以来一直使用图形化API和UI工具包来实现富有创造性且引人注目的应用程序.可以说,最有创意的软件开发就是游戏编程.比起让游戏愿景变成现实,优秀的创意还可使我们通过少许努力便获得更多的回

《HTML5 2D游戏编程核心技术》——第1章,第1.2节HTML5游戏开发最佳实践

本节书摘来自华章出版社<HTML5 2D游戏编程核心技术>一书中的第1章,第1.2节HTML5游戏开发最佳实践,作者[美] 戴维·吉尔里,更多章节内容可以访问"华章计算机"公众号查看. 1.2 HTML5游戏开发最佳实践 我们将在本书中持续地讨论一些关于游戏开发的最佳实践,首先介绍7个与HTML5有关的实践. 1)窗口失去焦点时暂停游戏. 2)窗口重新获得焦点时实现倒计时. 3)使用CSS实现UI特效. 4)对于运行缓慢的游戏做出检测和处理. 5)添加社交功能. 6)把所有

《HTML5 2D游戏编程核心技术》——第1章,第1.7节小结

1.7 小结Snail Bait游戏是一款HTML5平台游戏,是通过canvas元素的2D API实现的.正如你将在本书接下来的章节中看到的那样,这个API提供了一个强大且直观的功能函数集,通过这个函数集,你几乎可以实现任何一款能想象到的2D游戏.在这一章里,我们从一个最顶层了解了Snail Bait游戏的结构,这是为了获得一些比较直观的概念,并了解实现它的一些最佳实践.尽管通过阅读本章,你可以对游戏有一个直观的印象,但是如果试玩一下,将会对游戏有更好的理解,你可以在corehtml5games

《HTML5 2D游戏编程核心技术》——导读

目 录第1章 概述 1.1 Snail Bait游戏1.2 HTML5游戏开发最佳实践 1.2.1 窗口失去焦点时暂停游戏1.2.2 窗口重获焦点时实现倒计时功能1.2.3 使用CSS实现UI特效1.2.4 对游戏运行缓慢的状态做出检测和处理1.2.5 添加社交功能 1.2.6 将所有游戏图像放在单独的sprite表单中1.2.7 在服务器中存储高分榜和实时游戏数据1.3 特别功能 1.4 Snail Bait游戏中的HTML和CSS1.5 开始Snail Bait游戏编程 1.6 本书中使用的

《HTML5 2D游戏编程核心技术》——第1章,第1.4节特别功能

1.4 Snail Bait游戏中的HTML和CSS Snail Bait游戏使用了HTML.CSS和JavaScript,其中大部分是JavaScript,事实上,本书接下来的章节主要关注JavaScript,只是偶尔谈及HTML和CSS.图1.12显示了游戏上半部白色轮廓中的HTML元素,以及它们对应的CSS代码. 图1.12 Snail Bait上半部对应的CSS Snail Bait游戏中的所有事件都发生在arena内,arena是一个HTML DIV元素.arena的margin属性值

《HTML5 2D游戏编程核心技术》——第1章,第1.5节开始Snail Bait游戏编程

1.5 开始Snail Bait游戏编程图1.16显示了Snail Bait游戏的初始文件集合.在本书中,我们将逐步增加更多的文件.但是现在,我们需要一个HTML文件来定义游戏中HTML元素的结构:一个CSS文件来定义这些元素的可见属性:一个JavaScript文件来定义游戏的逻辑:以及两张图像,一个作为背景,一个作为跑步小人. 图1.16 Snail Bait游戏的初始文件集合 图1.17显示了游戏的开始时间点,只绘制出了背景和跑步小人.开始时,跑步小人并不是一个sprite对象,而是直接绘制

《HTML5 2D游戏编程核心技术》——第3章,第3.1节滚动背景和监控帧频

第3章 图形和动画是视频游戏的基础.能够绘制图形和图像是创造平滑的.不闪烁的动画最重要的技能之一,也是游戏开发人员必须要掌握的能力. 动画会持续地绘制动画帧,一般每秒30-60次.这个速率称为动画帧速率.每一个动画帧如同连环画的一页,每帧几乎和上一帧一样,仅仅存在着微小的差别,这样就可以在游戏快速显示动画帧时,创造出运动的效果.更多有关连环画的内容请阅读3.2节. 图3.1显示了一个单独的动画帧截图.这个游戏版本会保持这一状态到本章结束,图中显示了背景和平台从右向左滚动时的动画帧速率. 平台在动

《HTML5 2D游戏编程核心技术》——第2章,第2.1节使用开发者工具

第2章 在本书中,我们将从头开始编程实现一款游戏.像所有的游戏开发者一样,在开始之前,我们必须收集原始素材,并熟悉我们的工具.对于大多数游戏来说,下面的原始素材是必备的. 图像 音效 音乐 下面的内容则是可选的,使用它们可以给你的HTML5游戏增色. 网站图标 网页背景 GIF动画 网站图标是一些小的图标,可以在浏览器的地址栏或者标签中显示.网页背景可以是图像,也可以像Snail Bait游戏一样,用CSS画出来.Snail Bait游戏在加载资源时,会显示一个GIF动画. 幸运的是,所有必要的

《HTML5 2D游戏编程核心技术》——第2章,第2.6节小结

2.6 小结浏览器开发者工具对于编程实现HTML5游戏来说是必不可少的,在本书写作时,所有的主流浏览器都提供了合适的工具集.本章简要地描述了Chrome浏览器开发者工具,对实现游戏所需的大部分工具进行了简要介绍.其他浏览器厂商实现了类似的工具集,你在本章中学到的有关Chrome浏览器开发者工具的知识,同样也适用于其他浏览器.你很少会遇到一个熟练的视频游戏开发人员,同时也是技艺高超的艺术家或者音乐家.大多数游戏开发人员都会依赖于一些开源的图形.音效以及音乐资源.本章中,你了解了如何获取开源资源,并