javascript - HTML5 Canvas - 移动对象的最佳实践

Question

我正在使用 JavaScript 创建游戏。游戏将涉及玩家在地牢中导航。我的问题是对墙壁、门等对象进行编码的最佳方法是什么？我被困在两个明显的选择之间

1. 将每个对象绘制到 Canvas 上并根据玩家的移动方式移动对象

2. 将所有对象预先绘制到背景图像上，然后根据玩家的移动方式移动背景图像

我认为选项 2 会更容易，但我仍然需要检测物体的位置，这样玩家就不能直接翻墙。

基本上我想知道是否有人可以根据经验谈谈设计游戏的最佳方式，是否有这方面的资源？

Answer 1

Angular 色扮演游戏的性能要求低于街机游戏等。

您可能只需在新位置重新绘制所有内容即可。

但即便如此，您还是可以通过将背景(不经常移动)与经常移动的 Angular 色放在不同的层上来提高性能。

层可以像一个由 CSS 移动的背景 img 元素一样简单，也可以是一个单独的背景 Canvas ，它位于顶部播放器 Canvas 下。

好消息是，您可以从单层开始，然后在性能成为问题时相当轻松地更改为多层。

没有“设计游戏的最佳方式”，但这里有一些建议:

• 尽快在项目中运行一个微型工作原型(prototype)。
• 对原型(prototype)进行增量更改。
• 测试，测试，测试...

免责声明:我不设计游戏，但我设计质量控制应用程序，这些应用程序使用许多与游戏相同的交互技术。