开发者社区> 华章计算机> 正文

《HTML5 2D游戏编程核心技术》——第3章,第3.4节计算帧速率

简介:
+关注继续查看

本节书摘来自华章出版社《HTML5 2D游戏编程核心技术》一书中的第3章,第3.4节,作者[美] 戴维·吉尔里,更多章节内容可以访问云栖社区“华章计算机”公众号查看。

3.4 计算帧速率
程序清单3.9列出了函数calculateFps()的具体代码,该函数在Snail Bait游戏中用于计算帧速率。
程序清单3.9 计算帧速率
帧速率表示为帧/秒,是一帧除以上一个动画帧和当前动画帧之间的时间间隔来计算的,时间以秒为单位。
对前面算法做一个小小的修改,就可以实现一个帧速率读数器,如程序清单3.10所示。
程序清单3.10 更新snailbaits-fps元素


583cb45b49d143b40bd2bc6f8ff2d127f16cd950

程序清单3.10描述了一个重要的动画技术:以一个特定的速率,而不是动画速率来执行一个任务。如果每个动画帧都更新一次帧速率读数器,读数将变得不可读,因为它会一直改变。因此前面的代码每秒更新一次读数。
拥有了游戏主循环和帧速率后,我们就可以开始编程实现滚动游戏背景。

记住游戏主循环

一定要记住Snail Bait游戏会连续地调用它的许多方法,且频率通常在60帧/秒左右。
如果你忘记了Snail Bait游戏会持续地调用方法这一事实,代码将很难理解。例如,程序清单3.9中lastAnimationFrameTime变量的声明和赋零值仅仅发生一次。但是Snail Bait游戏在每个动画帧都会调用calculateFps(),即Snail Bait游戏第一次调用calculateFps()时,lastAnimationFrameTime的值是零,但是在接下来的调用中,它就不是零了(因为lastAnimationFrameTime的赋值是在calculateFps()中完成的)。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,大概有三种登录方式:
9065 0
HTML + CSS 为何得不到编程界的认可?
如果我在用HTML+CSS编程,那么,我能算是名开发人员吗?
1429 0
《HTML5游戏编程核心技术与实战》一2.3 图像API
除了绘制常用的图形以外,canvas提供了一系列的API能够对图像进行操作,常见的图像API有以下3个方法。
1256 0
《Java 2D游戏编程入门》—— 第1章 Hello World
大多数编程图书的第1章是创建一个Hello World应用程序,它执行一个简单的函数以确认一切都能工作。最简单的计算机游戏是一个黑色背景的窗口,还有一个紧凑的while循环,它负责尽可能快地清除屏幕并且重新绘制黑色的背景。
1562 0
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
19696 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
17986 0
《JavaScript高效图形编程(修订版)》——第6章 HTML5画布 6.1 画布的支持
大部分流行的浏览器都支持画布元素,包括Firefox、Chrome、Opera和Safari。2010年7月1日,微软通过IE9开发博客宣布其最新的浏览器会支持画布。事实上,该公司甚至为画布支持提供了硬件加速。
1138 0
《HTML5游戏编程核心技术与实战》一2.4 坐标变换
在绘制图像的过程中,经常可能需要对图像进行旋转、缩放等变形处理,canvas也提供了一系列的API帮助我们完成这些操作。
1474 0
10059
文章
0
问答
来源圈子
更多
+ 订阅
文章排行榜
最热
最新
相关电子书
更多
OceanBase 入门到实战教程
立即下载
阿里云图数据库GDB,加速开启“图智”未来.ppt
立即下载
实时数仓Hologres技术实战一本通2.0版(下)
立即下载