Fabric.js | 矩形cornerSize 属性

在使用 Fabric.js 进行画布绘制时，有时候需要对于矩形的四个角进行特定的设计，这时候可以通过 cornerSize 这个属性来实现。本文将重点介绍 cornerSize 属性的相关内容。

概述

cornerSize 可以用来指定矩形角的大小。通俗的说，可类比为矩形的圆角半径。该属性是 fabric.Rect 对象的属性，并且在默认情况下为5，代表着每个角的大小均为5个像素。需要注意的是，cornerSize 的值不应该超过矩形边框的一半，否则则会出现错误。

使用方法

在创建一个矩形时，可以传入属性参数来指定 cornerSize 的值，如下：

var rect = new fabric.Rect({
  width: 100,
  height: 100,
  fill: 'red',
  cornerSize: 10
});

注意事项

• 在设置 cornerSize 值时，不应该超过矩形边框的一半，否则会出现显示错误。
• cornerSize 属性只对于常规的矩形有效，对于其他的图形、路径等则无效。

结论

cornerSize 属性是一个十分实用的属性，它可以让我们更加方便的对矩形进行设计与绘制。在使用时，应该注意 cornerSize 值的范围，以及该属性只对于常规矩形有效等事项。希望本文可以对您学习和使用 Fabric.js 有所帮助。