KineticJS-如何拆分对象和文​​件

Question

我和我所在大学的一个小组正在使用KineticJS开发网络游戏。 我们使用了许多显示，删除和具有多个动作事件的形状。

现在我们还没有走的很远，但是我仍然觉得文件越来越大。 关于如何将所有内容分割成较小的文件，您有任何提示吗？ 是否可以将所有对象存储在一个文件中，而只在另一个文件中执行actionevents？ 欢迎任何有关工作流程外观的提示！

Answer 1

提示：使用工厂模型定义和创建您的动力学对象

这是一个演示，可以使用工厂在大约50行javascript中根据需要构建任意数量的圈子：

http://jsfiddle.net/m1erickson/s89Mu/

关于工厂模型

首先，创建一个JS对象，其中包含定义单个唯一圆的所有属性。

您可以将其视为如何构建此精确圆的蓝图。

稍后将使用myCircleDefinition5构建实际的Kinetic.Circle，并将其添加到图层中。

性能说明：可以使用JSON进行保存，以将myCircleDefinition5保存到文件或数据库中。

就像不打扰的javascript一样，您的数据定义与代码制作要保持分开，以获得更简洁的代码。

// create the definition of a circle -- not yet an actual circle

var myCircleDefinition5={
    cx: 150,
    cy: 100,
    radius: 20,
    fill: "blue",
    strokewidth: 4
}

这是使用myCircleDefinition5在图层上添加真实的动力学圆的代码：

// turn the object into a real Kinetic.Circle

makeCircle(myCircleDefinition5);

// this is the "factory" that takes a definition and produces a real Kinetic.Circle

function makeCircle(circleObject){
    var circle = new Kinetic.Circle({
        x:circleObject.cx,
        y:circleObject.cy,
        radius: circleObject.radius,
        fill: circleObject.fill,
        stroke: 'lightgray',
        strokeWidth: circleObject.strokewidth,
        draggable: true
    });
    layer.add(circle);
    layer.draw();
}