用于游戏 UI 的 Javascript 框架 [关闭]答案

【问题标题】：Javascript Framework for Game UI [closed]用于游戏 UI 的 Javascript 框架 [关闭]
【发布时间】：2011-07-28 17:04:57
【问题描述】：

在我作为开发人员的职业生涯中，我使用过一些 JavaScript 框架。即jquery、moo工具和atlas。但我所有的经验都围绕着专业的企业网站开发。我目前正在开发一款具有非常丰富的 UI 的游戏。我正在考虑完全用 javascript 和 HTML 实现 UI。所以现在我正在研究我在这方面的选择。有没有我可以使用的 javascript 框架来帮助我创建丰富的游戏 UI？

特别是我需要为角色和效果制作动画。如有必要，这可以逐帧进行，甚至可以像许多 Flash 动画喜欢使用的那样铰接。理想的框架应该具有内置功能来获取艺术资产，也许还有一个 XML 有效负载，当被解释时，它将描述艺术资产如何相互关联。对于逐帧，这将是我告诉它图像进入的顺序以及切换帧的速度的一种方式。对于铰链式框架，我可以告诉它在哪里放置手臂、腿和关节，并允许我将特定的关节运动分组到动画中。最后，理想的框架将支持纸娃娃功能，例如，我可以使用分层功能为角色戴上一副眼镜，或者不同的衣服或头发颜色。

我意识到我上面描述的理想很可能是不可用的，但如果有一些东西可以让我从 jquery 或其他类似框架中更接近我的理想，它将帮助我做出决定。

谢谢

【问题讨论】：

标签： javascript html javascript-framework

【解决方案1】：

你在这里要求的东西太具体了。在将游戏渲染到屏幕上时，您有 3 个主流的非插件选项

画布

画布是基于光栅的显示。您可以在画布上使用像easel.js 这样的窄抽象或像The render engine 这样的重抽象。现在这些可能没有您想要的细粒度功能。

他们不这样做的原因是性能。高性能代码和高级抽象不能齐头并进。您会发现使用重抽象而不是轻量抽象会带来严重的性能成本。

SVG

您可以使用 SVG，它呈现为基于矢量的图形。一个好的 SVG 抽象库是 rapheal。同样，仅仅因为性能成本，没有高级抽象库或框架来满足您的需求。

DOM

您也可以通过简单地使用 DOM 操作进行渲染。任何像 jQuery 或 MooTools 这样的库都可以做到这一点。如果您想使用 HTML UI 元素而不是自定义生成的元素，您可以使用一些重量级的 UI 工具包，例如 Sencha、SproutCore 和 Cappucino。

目前还没有任何通用和主流的东西可以让您的生活变得轻松。你可以看看一些javacript游戏引擎比如crafty

【讨论】：

如果您在我的情况下，您有更喜欢的路线吗？画布与 Dom 与 SVG。我想我基本上知道 SVG 是什么，大概它支持 .svg 文件并使用矢量形状和 DOM 创建图形非常简单，因为我在整个职业生涯中都使用过它，但 Canvas 与 SVG 和 DOM 有何不同？我知道 Canvas 是 HTML5 中可用的新标签，但我认为它的行为与 DIV 没有什么不同。
@omatase 我个人偏爱 rapheal。主要是因为你在 SVG 上绘制的所有东西都是一个对象，可以独立处理。 IE。您可以将事件处理程序附加到它。我在我的游戏中使用 MVC 模式，所以我喜欢为我的游戏实体创建一个模型并附加一个视图。视图只是一个 SVG 对象。
@omatase 画布是光栅显示。你可以渲染它。它还支持3d加速。它与 div 不同，因为您可以直接在其上绘制。这是tutorial

【解决方案2】：

Javascript 游戏框架：

【讨论】：