Fabric.js 文本框borderOpacityWhenMoving 属性

Fabric.js 是一个流行的 JavaScript 库，可以通过它在 Web 应用程序中轻松创建丰富的图形和动画。其中一个常用的功能就是创建文本框。在创建文本框时，Fabric.js 提供了很多有用的属性，其中之一就是 borderOpacityWhenMoving。

borderOpacityWhenMoving 属性的作用

borderOpacityWhenMoving 属性用于设置文本框在移动选择时的边框透明度。默认情况下，文本框在移动选择时的边框是不透明的，这可能会让用户分心并干扰他们的工作。通过设置 borderOpacityWhenMoving 属性，我们可以将边框透明度降低，使用户更集中精力。

如何设置 borderOpacityWhenMoving 属性

设置 borderOpacityWhenMoving 属性非常简单。只需要在创建文本框时将该属性设置为一个介于 0 到 1 之间的数值即可，其中 0 表示完全透明，1 表示完全不透明。

var textBox = new fabric.IText('Hello world', {
  left: 100,
  top: 100,
  borderOpacityWhenMoving: 0.5
});
canvas.add(textBox);

在上面的示例中，我们将 borderOpacityWhenMoving 属性设置为 0.5，这表示在移动选择时，文本框边框的透明度为 0.5。

注意事项

要注意的是，设置 borderOpacityWhenMoving 属性不会影响文本框的颜色和不透明度。如果希望设置文本框的背景颜色和不透明度，应使用 Fabric.js 提供的其他属性，如 backgroundColor 和 opacity。

参考资料

• Fabric.js 官方文档