我试图始终将帧渲染在最前端,以进行一种静态剪裁到预定义大小的目的。您可以移动对象,并且边框指示您单击保存时画布将被裁剪到的区域。
没有前台功能,因此我要解决的方法是渲染具有透明填充和单个像素宽笔触的矩形:
var out_frame = new fabric.Rect({
width: OUTPUT_WIDTH + 2,
height: OUTPUT_HEIGHT + 2,
fill: 'rgba(0, 0, 0, 0)',
selectable: false,
stroke: 'rgba(0,255,0,1)',
strokeWidth: 1
});
Run Code Online (Sandbox Code Playgroud)
并确保它停留在其他对象的前面:
canvas.on('object:added', function(e) {
out_frame.bringToFront();
});
Run Code Online (Sandbox Code Playgroud)
这就是问题所在:即使无法选择框架对象并且该框架对象是透明的,它也会阻止其下面的对象被鼠标操纵。例如,您无法通过单击选择框架下方的对象。尝试此操作时,不会选择框架对象-它是不可选择的,但下面的对象也不会被选择。
有什么建议如何解决这个问题,或者可能如何完全解决这个问题吗?
在我的鼠标中:在特定条件下向下事件监听器我想要停用用户刚刚用鼠标激活的对象:向下.换句话说,当用户在某些情况下尝试拖动对象时,我想执行一些代码并阻止拖动.
只是打电话
fabric.deactivateAll();
Run Code Online (Sandbox Code Playgroud)
将取消选择对象(对象控件消失)但拖动功能将不会中断.
我试过了:
fabric.fire('mouse:up');
Run Code Online (Sandbox Code Playgroud)
模拟用户释放对象并触发它但它对拖动没有影响.
如何以编程方式禁用拖动?如果两种方法不相同,我将如何在另一个对象上激活它?
上下文:我有一组用户可以正常操作的对象.但是,该组中有一个特殊对象,当用户尝试通过单击该特殊对象进行拖动时,应将其从组中删除,添加到画布并将拖动应用于特殊对象而不是整个组.取消选择特殊对象后,它将再次添加到组中.除了拖动功能从整个组转移到特殊对象的部分外,我的一切都在工作.