如何使用 FabricJS 创建一个等待光标悬停在对象上的矩形？

在本教程中，我们将使用 FabricJS 创建一个带有等待光标悬停在对象上的矩形。 wait 是可用的本机光标样式之一，也可以在 FabricJS 画布中使用。 FabricJS 提供了各种类型的光标，如默认、全滚动、十字准线、列调整大小、行调整大小等，它们在幕后重用了本机光标。 hoverCursor 属性设置光标悬停在画布对象上时的样式。

语法

new fabric.Rect({ hoverCursor: String }: Object)

参数

• 选项（可选） - 此参数是一个提供额外自定义的对象到我们的矩形。使用此参数，可以更改与 hoverCursor 属性相关的对象的颜色、光标、描边宽度和许多其他属性。

Options Keys

• hoverCursor - 该属性接受一个String，它确定光标的名称用于将鼠标悬停在画布对象上。使用此功能，我们可以设置将鼠标悬停在画布上的此矩形对象上时的默认光标值。

示例 1

传递 hoverCursor 类的键

默认情况下，当我们将鼠标悬停在画布中的矩形对象上时，光标类型为移动。让我们看一个代码示例，用于在将鼠标悬停在 FabricJS 中的矩形对象上时创建带有 wait 光标的画布。

   
   



   
Passing the hoverCursor key to the class
   
Hover over the rectangle to see the wait cursor
   
   

示例 2

演示它仅影响实例

在此示例中，我们传递 hoverCursor 键到矩形类，这意味着画布中的每个对象的 hoverCursor 属性都不会更改。仅针对该单个对象发生更改。下面的代码示例对此进行了说明 -

   
   



   
Demonstrating that it affects the instance only
   
Hover over the rectangle objects to see that wait cursor applies to the left rectangle only. We have not applied the hoverCursor property on the rectangle that is on the right.
   
   

위 내용은 如何使用 FabricJS 创建一个等待光标悬停在对象上的矩形？의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!