kineticjs - 在 groupS 中变换形状答案

【问题标题】：kineticjs - shift shapes in groupSkineticjs - 在 groupS 中变换形状
【发布时间】：2013-04-09 06:52:21
【问题描述】：

我有一个小问题。我的动力学阶段是这样的：

Stage -> layer0 -> group0 -> shapes
          layer1 -> group1 -> shapes
          layer2 -> group2 -> shapes

当调用 group0 事件（dragstart、dragmove 等）时，我需要移动 group1 和 group2。我试图做这样的事情：

group0.draggable = true;
group0.on('dragstart', function(){
  var a = #save first mouse position point
})
group0.on('dragmove', function(){
  #ref to group1 and group2 is store in group0 and as i debugged in chrome, this object is properly recognize 
  group1.setPosition(my new positions x, y)
  group2.setPosition(...)
})

换句话说。我需要来自不同层的连接组，并将它们视为一组嵌套的其他 3 个组。我的代码不起作用，是错误还是我忘记了什么？如何做到这一点？控制台没有错误，它只是不起作用，我可以移动 group0 但 group1 和 group2 setPosition 函数没有改变任何东西，尽管它们似乎被正确调用。谢谢

【问题讨论】：

你能把你的代码放在一个jsfiddle中吗？这样我们就可以看到它在哪里不起作用。

标签： kineticjs

【解决方案1】：

我只能推测，因为我面前没有你的代码。

但首先要检查的是您正在重绘图层。

group0.on('dragmove', function(){
    #ref to group1 and group2 is store in group0 and as i debugged in chrome, this object is properly recognize 
    group1.setPosition(my new positions x, y)
    group2.setPosition(...)
    group1.getLayer().draw(); //redraw group1 layer
    group2.getLayer().draw(); //redraw group2 layer
    // stage.draw(); // also a possibility
})

//you can also do transitions, which do redrawing for you.
group1.transitionTo({
    duration: 1, //how long the animation takes in seconds
    x: new position x coord
    y: new position y coord
}); 
//repeat for other groups you want moved

另外，需要注意的是，设置位置不会改变其中项目的位置，因此如果 shape1 位于 100,100，那么在组移动后它仍会报告为 100、100，因为位置是相对于它所在的容器。

【讨论】：