漫游的备忘录
转:HTML5游戏开发工具推荐:IMPACT
2012-3-17 漫游





Impact 是一个 JavaScript 游戏引擎,可以为桌面和手机浏览器开发令人惊叹的 HTML5 游戏。



我已经试过了四个其他 JavaScript 游戏引擎,这是我用过的第一个比较有意义的(……)Impact 是市场上第一个真正专业级的 JavaScript 和 HTML5 游戏引擎。



——《Game Developer Magazine》,2011年5月



随处可玩

Impact 可以在所有支持 HTML5 的浏览器上运行:火狐、Chrome、Safari、Opera 和(看吧),甚至是 Internet Explorer 9 。当然也包括 iPhone、iPod Touch 和 iPad。Kilofox.Net













想尝试一下吗?点击你的手机浏览器到 playbiolab.com 或 impactjs.org/drop 。手上没有 iPhone?看一个简短的演示视频吧!



更多关于在这些平台上的 Impact »



灵活的 2D 关卡编辑器



Impact 自带的多功能 Weltmeister 关卡编辑器,让您轻松创建您的游戏世界。无论是横向卷轴 Jump’n'Run ,还是纵向 RPG,Weltmeister 都能胜任。Kilofox.Net



所有实体(敌人、NPC、机关等)都可以立即在 Weltmeister 上使用。您可以在各实体间创建逻辑链:查找按钮、开门。



观看 Weltmeister 的介绍截图 »



强大的调试工具

易于使用的调试菜单可以帮助您找到性能瓶颈,随时查看究竟是什么正在你的游戏中运行。Kilofox.Net



几分钟入门

Impact 文档回答了你所有的问题。越来越多的视频教程和文章,以及带有大量代码示例的详细类引用,今天将帮助您开发第一个 HTML5 游戏!



 



安装

尽管用 Impact 写的游戏可以脱机工作,但大多数浏览器都不允许。这些浏览器由于同源策略的缺陷,拒绝访问某些功能(在 file://game/lib/ 下的文件与在 file://game/ 下的文件不被认为是在同一个“域”下)。 Opera 是个显著的例外。



此外,Weltmeister 关卡编辑器使用一些 .php 脚本来加载和保存关卡,列出目录的内容。Kilofox.Net



长话短说,您需要一个网页服务器。说到网页服务器,并不意味着是一个单独的服务器计算机,它只是你电脑里的一个提供 web 服务的程序。如果您使用的是 MacOSX ,您就已经拥有网页服务器了,也安装了 PHP ,只需启用它。在 Windows 中,您可以安装 Apache 和 PHP。这不是很复杂。如果您使用的是 Linux,那么您应该是个电脑虫,完全可以自己配置出来。^_^



如果你想手动安装 Apache 和 PHP,需要帮助,请问谷歌。Kilofox.Net



现在,你已经有网页服务器了,PHP 也运行了,对吧?好!不仅要把 Impact 解压到网页服务器的根目录下,还要让你的浏览器指向 http://localhost/ 。您应该看到了一个目录列表,包括您刚刚创建的 impact/ 子目录。试着通过 http://localhost/impact/weltmeister.html 加载 Weltmeister 。载入后应该没有任何错误。Kilofox.Net



如果有错误信息,你应该在浏览器控制台里查看。如果你不知道去哪里找错误控制台,往下读。



其他解决方案:




设置工作环境

如果你正在用 Impact 制作游戏(或者其它浏览器相关),浏览器的开发工具和 JavaScript 控制台将派上用场。如果你不使用它们,某些东西不工作了,你将陷入茫然。





现在你只需要一个文本编辑器来编辑你的源文件。如果你是自虐型的,Windows 的记事本都可以。然而,使用支持语法高亮的编辑器将使您生活得更轻松。



我使用的是 Komodo Edit,基本上是 Komodo IDE 的免费版本。不用看它的名字,Komodo Edit 还是一种 IDE。它真的很棒,可以用在 Windows、MacOSX 和 Linux 上。



如果你只是想要一个轻量级的编辑器,我可以推荐 SciTE for Windows 和 Linux。它还可以用在 MacOSX 上,但是设置它有点麻烦。



对于 MacOSX ,听说 BBEdit 和 TextMate 大概是“最好”的编辑器。Kilofox.Net



这些只是根据我个人的经验提出的一些建议。不要信任我。请随意到处看看,尝试不同的编辑器和 IDE。



目录结构

Impact 安装完成以后,应该有以下的目录结构:






  1. media/


  2. lib/


  3. lib/game/


  4. lib/game/entities/


  5. lib/game/levels/


  6. lib/impact/


  7. lib/weltmeister/




复制代码




您的所有游戏资源,比如图像、声音和音乐,都应放在 media/ 目录下。Kilofox.Net



lib/ 目录存放所有的 JavaScript 文件。lib/impact/ 存放 Impact 引擎本身。

lib/weltmeister/ 存放关卡编辑器的所有源文件。

您自己的游戏源文件应该放在 lib/game/ 下。

实体的源文件应该放在 lib/game/entities/ 下。

这样 Weltmeister 才能找到它们。



HTML 文件

用 Impact 写的游戏可以直接在浏览器中运行。不需要任何插件。然而,由于 JavaScript 本身没有显示东西的地方,Impact 需要在一个 HTML 页的 <canvas> 标记上渲染游戏画面。



最基本的 HTML 页看起来类似这样:Kilofox.Net






  1. <!DOCTYPE html>


  2. <html>


  3. <head>


  4. <title>My Awesome Game!</title>


  5. <script type=”text/javascript” src=”lib/impact/impact.js”></script>


  6. <script type=”text/javascript” src=”lib/game/game.js”></script>


  7. </head>


  8. <body>


  9. <canvas id=”canvas”></canvas>


  10. </body>


  11. </html>




复制代码




当然,这个页可以用后来的内容(文字、链接、图像等)进一步扩展,就像其他 HTML 页一样。也可以使用 CSS 样式。我在这儿真的不能再详细说了,因为这本身就是一个庞大的话题。但是,这个基本的 HTML 页确实是你的游戏开发工作所需要的全部。



请注意,这个 HTML 页只引用了两个 JavaScript 文件:引擎和游戏主脚本。其他的所有 JavaScript 文件会被这两个文件自动包含进来。Kilofox.Net



在发布您的游戏之前,也可以把所有的 JavaScript 烘焙到一个(压缩的)文件中。这将大大缩短你的游戏的初始加载时间。然而,为方便开发,最好是让文件分开,有一个更好地综览。更多信息,请参阅烘焙



您的游戏所需的所有图像和声音文件,也将通过 JavaScript 动态加载。Impact 的预加载,确保在游戏开始之前,所有的资源都被加载进来。Kilofox.Net



Impact 自带一个默认的 index.html ,用来加载 lib/game/game.js 文件。



weltmeister.html 用来加载编辑器。更多信息,请查看 Weltmeister 编辑器的介绍。



模块

JavaScript 本身并不提供 include() 函数,来加载其他 JavaScript 源文件。你可以写你自己的 include() 函数,用 Ajax 来加载文件,但是这会使你的游戏无法调试,因为所有的行号和文件名都会丢失,错误信息将比“匿名函数 anonymous() 中的错误“更难确定。



相反,Impact 的源代码被组织成模块。一个模块定义通常看起来类似这样:Kilofox.Net






  1. ig.module(


  2. ‘game.my-file’


  3. )


  4. .requires(


  5. ‘impact.game’,


  6. ‘impact.image’,


  7. ‘game.other-file’


  8. )


  9. .defines(function(){


  10. // code for this module


  11. });




复制代码




模 块名“game.my-file”直接对应文件名。因此,这个模块位于 lib/game/my-file.js。同样,在 requires() 方法中列出的模块将分别从 lib/impact/game.js、 lib/impact/image.js 和 lib/game/other-file.js 载入。这些必需的文件会在模块主体(传递给 .defines() 的函数)执行之前被加载。你可以阅读更多”ig 核心“参考资料中有关模块的部分。



Impact 是如何工作的?

Impact 引擎的核心,不是一个库,而是一个框架。也就是说,Impact 提供一个功能齐全的盒子,你可以把你的代码扔进去。Impact 运行其自身。你只需要把你的东西添加给它,也由引擎来管理。



“你的东西”,在大多数情况下,是 Impact 的一个基类的子类。最重要的一个就是 ig.Entity 类。游戏世界中的每一个对象,都将是 ig.Entity 的一个子类。Kilofox.Net



只要你启动你的游戏,Impact 就会建立一个调用 ig.system.run() 方法的时间间隔,每秒钟60次。这个方法做一些看家的东西,然后调用你的游戏的 run() 方法(默认情况下,只调用它自身的 update() 和 draw() )。



ig.Game 的 draw() 方法是很无聊的,它只是清除屏幕,在每一个背景层和实体上调用 draw()。



update() 方法更新背景层的位置(这是它感兴趣的地方),在每个实体上调用 update() 。实体默认的 update() 方法,是根据它的物理属性(位置、速度、反弹力等)移动,并且把游戏的碰撞地图也考虑进去。Kilofox.Net



在所有的实体更新完成后,游戏的 .checkEntities() 方法被调用。这个用来解决所有的动态碰撞,也就是实体与实体的碰撞。如果它与另一个实体重叠,而且“希望”检查,它还调用一个实体的 .check() 方法(更多详细信息,请参阅”类引用“)。



您可以在自己的 ig.Entity 和 ig.Game 子类中重写这些方法——您可以提供自己的逻辑,然后,如果你喜欢,可以用 this.parent() 调用原有方法。Kilofox.Net



记住,所有这一切都发生在每一帧上。那就是(如果浏览器能够跟上的话)每秒60次。



 



(转自:http://www.kilofox.net/forum/forum.php?mod=viewthread&tid=224,原文:http://impactjs.com/documentation)