2

I have created CAShapeLayer with custom UIBezierPath and filled color. How can I change the area inside a path? Make it bigger/lower.

    private var path = UIBezierPath()
    private var shapeLayer = CAShapeLayer()

    override public func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        if let touch = touches.first as UITouch? {
            let touchPoint = touch.location(in: self)
            path.move(to: touchPoint)
        }
    }

    override public func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
        if let touch = touches.first as UITouch? {
            let touchPoint = touch.location(in: self)
            path.addLine(to: touchPoint)
            shapeLayer.path = path.cgPath
            shapeLayer.strokeColor = strokeColor.cgColor
            shapeLayer.fillColor = UIColor.clear.cgColor
            shapeLayer.lineWidth = lineWidth
            layer.addSublayer(shapeLayer)
        }
    }

    override public func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
        if let touch = touches.first as UITouch? {
            let touchPoint = touch.location(in: self)
            path.addLine(to: touchPoint)
            path.close()
            shapeLayer.path = path.cgPath
            shapeLayer.strokeColor = UIColor.clear.cgColor
            shapeLayer.fillColor = strokeColor.cgColor
            shapeLayer.lineWidth = lineWidth
            layer.addSublayer(shapeLayer)
        }
    }

So I have a problem with changing the area. How to change the area with filled color? Or how to modify path with/or without some points?

Steps needed: - select frame with gestures; - fill color; - update frame make it bigger/smaller with gestures(touches began/moved/ended)

Similar to this library https://github.com/TinyCrayon/TinyCrayon-iOS-SDK

user2398911
  • 96
  • 1
  • 14

1 Answers1

2

You can't change CAShapeLayer.

But I've achieved this effect with 2 steps.

First - select an area with bezierPath, save path.

Second - Create CGContext, add image over our image with the color of bezierPath fill color, then add mask with our path and add functionality erase/unerase image.

user2398911
  • 96
  • 1
  • 14