在本教程中，我们将使用 FabricJS 设置矩形控制角的颜色。 cornerColor 属性允许我们在对象处于活动状态时操纵控制角的颜色。
语法
new fabric.Rect({ cornerColor: String }: Object)
参数
选项（可选） – 此参数是一个对象，它为我们的矩形提供额外的自定义。使用此参数，可以更改与以cornerColor为属性的对象相关的颜色、光标、描边宽度等属性。
选项键
cornerColor – 该属性接受一个String，它允许我们为控制分配颜色主动选择对象时的角点。默认值为 rgb(178,204,255)。
示例 1
将 cornerColor 作为带有颜色的键传递名称作为值
AI角色脑洞生成器
一键打造完整角色设定，轻松创造专属小说漫画游戏角色背景故事
176 查看详情
让我们看一个使用cornerColor属性更改颜色的代码示例。在在这种情况下，我们将值“green”分配给该键，从而使控制角显示为绿色。
Passing cornerColor as key with a color name as value
Select the rectangle to see the colour of its controlling corners
// 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", borderColor: "black", borderScaleFactor: 3, cornerColor: "green", }); // Add it to the canvas canvas.add(rect);
示例 2
将 RGBA 值分配给 cornerColor 属性
而不是传递简单的颜色名称作为String 值给键，我们也可以分配一个 RGBA 值。 RGBA 代表红、绿、蓝和 alpha，其中 alpha 是不透明度。让我们看一个代码示例来说明如何做到这一点：
Assigning an RGBA value to the cornerColor property
Select the rectangle to see the colour of its controlling corners
// 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", borderColor: "black", borderScaleFactor: 3, cornerColor: "rgba(34,139,34,0.9)", }); // Add it to the canvas canvas.add(rect);
以上就是如何使用 FabricJS 设置矩形控制角的颜色？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/530452.html
微信扫一扫 
支付宝扫一扫 
