Question

如果要更改未选中或未激活的TextBox对象的位置，则必须先选择它，然后再将其拖动到新位置。我宁愿只通过将光标移到对象上并仅单击对象就可以移动它。

Answer 1

我使用了 mouseover 事件来处理此问题。将 mouseover 事件绑定到对象（在本例中为 TextBox ）并通过传递对象在画布上应用 setActiveObject（）方法解决了此问题。这是代码：

this.canvas = new fabric.Canvas('canvas');
let text = new fabric.Textbox('Enter text here', {
  fontFamily: 'Helvetica',
  fill: "#C0C0C0",
  textAlign: 'center',      
  borderColor: '#00c6d2',
  editingBorderColor: '#00c6d2',
  padding: 15,
  originX: 'center',
  originY: 'center',
  width: 300,
});
text.on('mouseover', (e) => {
  this.canvas.setActiveObject(text);
});
this.canvas.add(text);
this.canvas.centerObject(text);
this.canvas.renderAll();

Makrup如下：

<canvas id="canvas" width="500" height="500"></canvas>

拖动FabricJS对象之前需要选择

1 个答案: