Actually, I made this problem complicated myself, and it can be solved by adding a borderLayer. First subtract the borderwidth from the size of the canvas, construct the path based on the Size, get the borderLayer, and add it. It’s actually very simple, but there are a lot of things associated with it. There are shapes, editpoints, and other elements on the canvas, and their positions need to be recalculated based on the borderWidth.
Use all gray as the background color, cover it with red and green, and set the view.layer.mask twice to meet the requirements of CAShapeLayer(). Isn’t it quite convenient?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Actually, I made this problem complicated myself, and it can be solved by adding a borderLayer.
First subtract the borderwidth from the size of the canvas, construct the path based on the Size, get the borderLayer, and add it.
It’s actually very simple, but there are a lot of things associated with it. There are shapes, editpoints, and other elements on the canvas, and their positions need to be recalculated based on the borderWidth.
Use all gray as the background color, cover it with red and green, and set the view.layer.mask twice to meet the requirements of CAShapeLayer(). Isn’t it quite convenient?