6

谁能解释为什么（事实上，如果）在使用 Kinetic 之类的东西时最好将画布游戏的主要部分抽象到不同的层？

这当然是你应该做的，到目前为止我一直是：一层用于背景，一层用于玩家角色，以及其他。

然后我遇到了一种情况，我需要一个图层的形状位于另一图层的形状后面 - 但是将整个图层移动到另一图层后面不是一个选项，所以我不情愿地重新编码，以便整个游戏位于一个层。

但令我惊讶的是，我仍然可以做我需要的一切。我仍然可以为单个形状或组设置动画或处理事件。

简而言之：显式分层带来什么优势？单层方法可能会面临哪些陷阱？

4

3 回答 3

6

实际上，层通常会带来巨大的优势。但是，有时它们不是必需的。只是给出一个想法 - 比较 PhotoShop（图层）和 MS Paint（无图层）。如果这给了你这个想法，那就是它！

如果不是：层是一个组织概念。它使您可以分段处理数据。他们允许：

  1. 将某些变换应用于整个图层。
  2. 自动按图层对对象进行分类，以便您可以获取图层的所有对象并轻松使用它们。
  3. 将层中发生的任何事情与其他层中发生的事情隔离开来。
  4. 禁用/启用整个图层。
  5. 更多！

如您所见，层通常允许在内容组织级别上实施封装等抽象，并且在某种程度上允许多态性。单层方法带来的陷阱就是——耦合太紧——一个来自永久混沌世界的野兽，封装和多态性为永恒而战。努夫说！

于 2012-08-29T07:49:19.700 回答
5

如果你的游戏包含很多不同的东西，那么绘制所有东西可能需要一些时间。同一层太多会降低性能。尽管太多的层也是如此。

查看：http ://www.html5canvastutorials.com/labs/html5-canvas-kineticjs-drag-and-drop-stress-test-with-1000-shapes/

于 2012-08-29T07:08:51.013 回答
3

在组织方面，noncom 的回答是正确的。然而，正如他所指出的，他的回答更多地是关于画布动画，并且您指出 KineticJS 提供了自己的工具来提供相同的组织优势是非常正确的。

因此，与组织无关，我们所拥有的只是性能。话虽如此，主要区别在于每个“层”对应一个不同的画布标签。

那么简单的答案是，拥有多个图层允许您一次选择性地仅重绘一个画布标签。想一想，如果您有对象在背景上移动，您是否希望每次这些对象移动时都清除并重新绘制背景？

如果您不使用图层，那就是正在发生的事情。你想要的是一个只有在背景发生变化时才会再次绘制的背景，这意味着背景层。

这是否真的值得在很大程度上取决于您的应用程序，但这就是想法。层（组织之外）的重点是将所需的绘图过程与实际需要绘制的事物隔离开来。对于复杂的动画，这对于保持良好的性能非常重要。

这是一个 jsperf 供参考：http: //jsperf.com/layered-canvases/3

于 2014-06-10T01:40:29.743 回答