如何使用 FabricJS 建立一個幫助遊標懸停在物件上的矩形？

在本教學中，我們將使用 FabricJS 建立一個帶有幫助遊標懸停在物件上的矩形。 「help」是可用的本機遊標樣式之一，也可以在 FabricJS 畫布中使用。 FabricJS 提供了各種類型的遊標，例如預設、全滾動、十字準線、列調整大小、行調整大小等，它們實際上在幕後重用了本機遊標。hoverCursor屬性設定遊標停留在畫布物件上時的樣式。

語法

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

參數

• #選項（可選）- 此參數是一個提供額外自訂的物件到我們的矩形。使用此參數，可以變更與hoverCursor屬性相關的物件的屬性，例如顏色、遊標、描邊寬度和許多其他屬性。

< /ul>

選項鍵

• hoverCursor- 此屬性接受一個字串#，它決定懸停在畫布物件上時使用的遊標的名稱。使用它，我們可以設定將滑鼠懸停在畫布上的此矩形物件上時的預設遊標值。

範例1

傳遞hoverCursor類別的關鍵

預設情況下，當我們將滑鼠懸停在畫布中的矩形物件上時，遊標類型為「移動」。讓我們看一個使用建立畫布的程式碼範例>help將遊標懸停在 FabricJS 中的矩形物件上。

     
  
Passing the hoverCursor Key to the class
 
Hover over the rectangle to see the help cursor
    

登入後複製

範例2

證明這僅影響實例

在此範例中，我們傳遞hoverCursor鍵到矩形類，這表示畫布中的每個物件的hoverCursor屬性都不會更改。僅針對該單一物件發生變更。下面的程式碼範例對此進行了說明 -

     
  
Demonstrating that it affects the instance only
 
Hover over the rectangle objects and observe that the help cursor applies to the left object only. We have not used the hoverCursor property on the right object.
    

登入後複製

以上是如何使用 FabricJS 建立一個幫助遊標懸停在物件上的矩形？的詳細內容。更多資訊請關注PHP中文網其他相關文章！