Is there a way to dynamically adjust the control point of a bezierpath's quadcurve?
I'm creating a small drag/drop drawing app for kids. I'd like them to be add a line onto the canvas then adjust the curve point to create a smile or a frown using a drag of the finger .
I'm currently drawing a simple line using UIBezierPath and I've added a gesture recognizer to the parent. I've tried removing all points and adding a new quadcurve on drag as well as redrawing the path with new control point coordinates.
This is how i create the path:
//path defined else where
func createBezierPath (withRectRef rectRef: RectFramer)-> UIBezierPath {
path.move(to: rectRef.bottomLeft)
path.move(to: rectRef.bottomRight)
path.move(to: rectRef.topRight)
path.addQuadCurve(to: rectRef.topLeft, controlPoint: CGPoint(x:rectRef.midX, y: rectRef.midY )) // top middle control point
return path
}
add it to view
let shapeLayer = CAShapeLayer()
shapeLayer.path = createBezierPath(withRectRef: frameRef!).cgPath
shapeLayer.strokeColor = UIColor.blue.cgColor
shapeLayer.fillColor = UIColor.clear.cgColor
shapeLayer.lineWidth = 4.0
shapeLayer.position = CGPoint(x: 0, y: 0)
self.backgroundColor = UIColor.clear
// add the new layer to our custom view
self.layer.addSublayer(shapeLayer)
let gestureRecognizer = UIPanGestureRecognizer(target: self, action: #selector(handlePan))
gestureRecognizer.delegate = self
self.addGestureRecognizer(gestureRecognizer)
Any help/tips will be appreciated
I was unable to achieve what I wanted trying to adjust the quadcurve of an existing path..instead, I had to redraw the path with the adjusted curve each time.