Search code examples
iosswiftpathuibezierpath

Swift Update addQuadCurve Control Point?


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


Solution

  • 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.