效果预览:
1.只填入一个参数,会进行对四个角度进行裁剪,且圆弧度数一致
![只填入一个参数,会进行对四个角度进行裁剪,且圆弧度数一致](https://i-blog.csdnimg.cn/blog_migrate/071251117dc6a6af2c51060ebfe2d90e.png)
2.填入两个参数,0控制左边两个角度,1控制右边两个角度
![填入两个参数,0控制左边两个角度,1控制右边两个角度](https://i-blog.csdnimg.cn/blog_migrate/234d116dd92c95f090c54679b2712896.png)
3.输入四个角度的度数,控制的方向为左上开始以顺时针的顺序进行设置![输入四个角度的度数,控制的方向为左上开始以顺时针的顺序进行设置](https://i-blog.csdnimg.cn/blog_migrate/9f0c773ce4d0bf9b67b5e560a0580e7d.png)
脚本使用方法:
1.创建一个空节点,然后把脚本添加到节点上
2.设置脚本节点的尺寸(设置方式与Mask的组件使用方法一致)
3.根据上图示例设置你需要裁剪的圆角尺寸
4.添加子节点
主要代码展示:
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/67ab972a29ef6ba5517bf424905da665.png)
主要代码其实是继承Mask组件之后,拿到组件上的_graphics属性,然后重新绘制graphics更改Mask的裁剪形状,并进行渲染。
脚本文件(RectMask.js)