我们可以使用 borderopacitywhenmoving 属性在画布中移动矩形时更改矩形的不透明度。
语法new fabric.rect({ borderopacitywhenmoving: number }: object)
参数选项（可选） - 此参数是一个对象，它为我们的矩形提供额外的自定义。使用此参数，可以更改与 borderopacitywhenmoving 为属性的对象相关的颜色、光标、描边宽度和许多其他属性等属性。
选项键borderopacitywhenmoving - 此属性接受一个数字，指定不透明程度我们希望在移动矩形时边框保持不变。它允许我们在移动矩形对象时控制边框的不透明度。默认值为 0.4。
示例 1显示 borderopacitywhenmoving 属性的默认行为
让我们看一个代码示例，它显示了boderopacitywhenmoving 属性的默认行为。当我们选择矩形对象并移动它时在画布周围，选区边框的不透明度从 1（完全不透明）更改为 0.4这使它看起来有点半透明。
<!doctype html><html><head> <!-- adding the fabric js library--> <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/510/fabric.min.js"></script></head><body> <h2>displaying the default behaviour of borderopacitywhenmoving property</h2> <p>move the rectangle to see the default behaviour of <b>borderopacitywhenmoving</b></p> <canvas id="canvas"></canvas> <script> // initiate a canvas instance var canvas = new fabric.canvas("canvas"); canvas.setwidth(document.body.scrollwidth); canvas.setheight(250); // initiate a rectangle object var rect = new fabric.rect({ left: 125, top: 90, width: 170, height: 70, fill: "#cf1020", padding: 9, bordercolor: "black", }); // add it to the canvas canvas.add(rect); </script></body></html>
示例 2将 borderopacitywhenmoving 作为键传递
让我们看一个为 borderopacitywhenmoving 属性赋值的代码示例。在本例中，我们将值指定为 0。它告诉我们，当我们移动矩形时，边框不透明度将更改为 0 并且不可见。
<!doctype html><html><head> <!-- adding the fabric js library--> <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/510/fabric.min.js"></script></head><body> <h2>passing borderopacitywhenmoving as key</h2> <p>move the rectangle to see the change in value of <b>borderopacitywhenmoving</b></p> <canvas id="canvas"></canvas> <script> // initiate a canvas instance var canvas = new fabric.canvas("canvas"); canvas.setwidth(document.body.scrollwidth); canvas.setheight(250); // initiate a rectangle object var rect = new fabric.rect({ left: 125, top: 90, width: 170, height: 70, fill: "#cf1020", padding: 9, bordercolor: "black", borderopacitywhenmoving: 0, }); // add it to the canvas canvas.add(rect); </script></body></html>
以上就是如何使用fabricjs设置矩形移动时的边框不透明度？的详细内容。