Question

我遇到了关于在fabricjs中实现剪贴板的问题。当我克隆组时，boundingBox / Controls位于正确的位置，但是对象被抛出在Canvas的左上角，我只能移动控件。

到目前为止，这是我的实现：

int main()
{
  SDL_Init(SDL_INIT_VIDEO);

  {
    std::unique_ptr<SDL_Window, decltype((SDL_DestroyWindow))>
      win { SDL_CreateWindow("asdf", 100, 100, 640, 480, SDL_WINDOW_SHOWN),
        SDL_DestroyWindow };
    if (!win.get())
    {
      SDL_LogError(SDL_LOG_CATEGORY_APPLICATION, "SDL_CreateWindow Error: %s",
          SDL_GetError());
      return 1;
    }
  } // win destroyed before SQL_Quit

  SDL_Quit();
}

我对这些方法和逻辑的实现可能是多余的，它们可能是一种更好，更小，更有效的方法（请告诉我）。

我不确定这是一个错误还是我做错了什么。请记住，我不知道哪些对象可能被克隆，这就是为什么我需要知道我是否需要使用异步克隆，这只是我发现如何做到的方式。

更新：这是问题的jsfiddle（将对象分组并复制/粘贴）

Answer 1

它看起来像问题在setActiveGroup函数中。检查此fiddle。在第49号和第49行54我写了console.log（）。在控制台中查看结果，可以看到_objects属性长度为0.这意味着组中没有对象。现在只需删除setActiveGroup函数。现在_objects属性长度是2.

我不知道它是否正常或在setActiveGroup函数中有任何错误。但后来我尝试在画布中手动添加组对象，而不是一次添加完整组。我用下面的替换你的小提琴线48。

clone.forEachObject(function(obj){
    canvas.add(obj);
});

canvas.deactivateAll();

现在它奏效了。见fiddle。

如果您想手动设置活动组或对象，则安全使用canvas.deactivateAll（）。您也可以根据自己的要求使用canvas.discardActiveGroup（）或canvas.discardActiveObject（）。

我认为我们无法将克隆组直接添加到画布中。相反，我们必须单独添加该组的每个对象。请其他人确认。

Answer 2

我最近遇到了同样的问题;将克隆对象抛出画布的原因是，当您计算要克隆的对象的左侧时，您获得组内的左侧位置而不是画布。要在这里获取与对象相关的画布，它是如何为我工作的

var cloneGroup = canvas.getActiveGroup();
if (cloneGroup) {
            var objectsInGroup = cloneGroup.getObjects();
            objectsInGroup.forEach(function (object) {
                var cloneobj = object.clone();
                cloneobj.set({
                    left: ((object.left + object.group.left )+20),// added 20 to add some gap
                    top: ((object.top + object.group.top) + 20),
                    width: object.get('width'),
                    height: object.get('height'),
                });
                canvas.add(cloneobj);
            });
        }
 canvas.renderAll();

FabricJS剪贴板实现（复制/粘贴）

2 个答案: