我花了几个小时在谷歌上搜索 Kinetic.Layer.draw() 方法。我发现的只是用例——没有关于如何、何时以及为什么使用它的文档。也许它已经被弃用了？
这些是我在学习和使用这个美妙的框架时使用的主要链接：
http://kineticjs.com/docs/index.html
如果有人向我解释这种误解，那将非常有帮助。
问问题
1257 次
2 回答
9
实际上draw()并且drawHit()在文档中，但它们的记录很差：
draw()
绘制图层场景图
drawHit()
绘制图层命中图
令人惊讶的是，我找不到第 3 次也是最后一次绘制方法：drawScene()在 Kinetic Docs 中。同样令我惊讶的是，没有发现这 3 个函数是从以下父类扩展的Kinetic.Stage：Kinetic.Container
无论如何，我认为这个 SO 问题完美地解释了方法的差异： KineticJS 绘制方法之间有什么区别？
当然，使用这些功能是不可避免的，除非您的画布/舞台在整个应用程序中是静态的，否则您最终需要使用其中之一。（*可能有例外，见下文）
要回答您的问题：
如何：
调用.draw()任何Kinetic.Container包括：stage layer和group，或任何Kinetic.Node包括所有Kinetic.Shape
例子：
stage.draw(); //Updates the scene renderer and hit graph for the stage
layer.drawHit(); //Updates the hit graph for layer
rect.drawScene(); //Updates the scene renderer for this Kinetic.Rect
为什么：
我认为Kinetic.Stage每次发生变化时都不要重新绘制所有内容是一种性能问题。当我们想要更新和渲染舞台时，我们可以通过这种方式以编程方式控制绘制方法的使用。正如您可能想象的那样，如果我们在场景中有 10000 个节点，那么必须一直绘制舞台是非常昂贵的。
什么时候：
drawScene()
任何时候您需要更新场景渲染器（例如.setFill()用于更改形状的填充）
drawHit()
如果要将事件绑定到形状，则更新命中图，以便任何事件的命中区域都将更新为节点更改。
draw()
每当您需要执行上述两项操作时。
最后，也许示例/实验室将是这里最有益的学习工具，所以我准备了一个JSFIDDLE供您测试差异。按照说明阅读我的评论，以更好地了解正在发生的事情。
*注意：我在上面提到了必须使用绘图方法的一个例外。那是因为每当您向舞台添加图层时，图层中的所有内容都会自动绘制。小提琴底部有一个小例子。
于 2013-09-19T13:56:22.723 回答
4
该draw()方法基本上用于绘制与您调用该方法的容器相关联的所有（可见）元素。因此，它不仅限于，Kinetic.Layer还可以用于Kinetic.Group，Kinetic.Container等等......
何时以及为何使用：
每当您对画布进行任何更改时，您都会调用相应容器的Draw()方法。KineticJS 不会刷新画布，除非您使用Draw(). 通常，尝试调用受您的更改影响的最小容器，以利用有效的缓存并仅重绘受影响的画布的一部分。
举个例子：你的应用程序中有 2 层。Layer1 用于静态背景和其他一些不需要每次都重绘的静态项目。Layer2 包含您的移动元素或活动对象。然后你可以简单地拨打电话Layer2.draw()
为了增加复杂性，您有一组对象，比如说所有菜单项。当用户按下任何菜单按钮时，最好调用menuGroup.draw()而不是其父层的绘制函数。
于 2013-09-19T09:50:33.593 回答