Removing old sections of curved line when drawing new sections in Swift - ios

Question

I have Swift 2 code below that draws curved lines when the user touches and moves their finger across the screen. New sections of the curved line are added as the user moves their finger to give one continuous curved line on screen. (top image)
However, I wish to change the below code so that as each new section of the line is added and drawn to screen, the previous section and earlier sections are deleted, so that all is seen on the screen is the new section and nothing else. (bottom image)
What needs to be modified in the section of code below to achieve this?
// Swift 2 code below tested using Xcode 7.0.1.
class drawLines: UIView {
let path=UIBezierPath()
var previousPoint:CGPoint = CGPoint.zero
var strokeColor:UIColor?
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
override func drawRect(rect: CGRect) {
strokeColor = UIColor.blackColor()
strokeColor?.setStroke()
path.lineWidth = 10
path.stroke()
}
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
let touch: AnyObject? = touches.first
let currentPoint = touch!.locationInView(self)
path.moveToPoint(currentPoint)
previousPoint=currentPoint
self.setNeedsDisplay()
}
override func touchesMoved(touches: Set<UITouch>, withEvent event: UIEvent?) {
let touch: AnyObject? = touches.first
let currentPoint = touch!.locationInView(self)
let midPoint = self.midPoint(previousPoint, p1: currentPoint)
path.addQuadCurveToPoint(midPoint,controlPoint: previousPoint)
previousPoint=currentPoint
self.setNeedsDisplay()
path.moveToPoint(midPoint)
}
override func touchesEnded(touches: Set<UITouch>, withEvent event: UIEvent?) {
self.setNeedsDisplay()
}
override func touchesCancelled(touches: Set<UITouch>?, withEvent event: UIEvent?) {
self.touchesEnded(touches!, withEvent: event)
}
func midPoint(p0:CGPoint,p1:CGPoint)->CGPoint
{
let x=(p0.x+p1.x)/2
let y=(p0.y+p1.y)/2
return CGPoint(x: x, y: y)
}
}

Answer 1

As far as I know, there's no way to remove points from a UIBezierPath. The solution you're looking for is to store the points in an array, which you can modify freely, then create your path from that point array.
Update
I'm getting a bit confused re-reading your post alongside the comments you've posted. That being said, I've tried to make the example below contain all the elements you need – you might have to re-arrange them if I have not understood you 100%.
This code continuously adds points to an array from the point a touch begins, including while it moves. I added a cap to the maximum number of points so that it removes excess line points if needed. When the user releases their finger I've made it clear all the points.
Note: I've tried to keep the code as simple as possible so that it's clear. Once you find the correct combination of adding/removing points that matches your needs, you should probably look at optimising this. In particular, this assumes a naïve method of drawing where all drawing happens simultaneously (vs deltas), which isn't efficient. The method of removing excess points can also be optimised once you understand it.
import UIKit
class ViewController: UIViewController {
var points = [CGPoint]()
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
addTouch(touches.first)
}
override func touchesMoved(touches: Set<UITouch>, withEvent event: UIEvent?) {
addTouch(touches.first)
}
override func touchesEnded(touches: Set<UITouch>, withEvent event: UIEvent?) {
points.removeAll()
}
override func touchesCancelled(touches: Set<UITouch>?, withEvent event: UIEvent?) {
points.removeAll()
}
func addTouch(touch: UITouch?) {
guard let touch = touch else { return }
let currentPoint = touch.locationInView(self.view)
points.append(currentPoint)
// if you want a limit on your line length, you need these lines
// 20 is an arbitrary number
while (points.count > 20) {
points.removeFirst()
}
}
}
All that remains is for you to add that to your current line drawing code, and you should be good to go.
Apple have done a number of good WWDC talks on graphics performance. This one in particular might be helpful.

Answer 2

If I understand your question correctly, you'll want to reset the
path in the touchesBegan() method
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
path.removeAllPoints()
// ...
}

Answer 3

You could save an array of points and rebuild your bezier path each time as TwoStraws recommends.
Another option would be to draw your curve using a CAShapeLayer, and change the shapeBegin property. (As you move from shapeBegin = 1.0 to shapeBegin = 0.0 it truncates the beginning of the shape.)
A third option would be to edit the path to delete the earlier points. Erica Sadun has sample code in her outstanding iOS Developers' Cookbook series that shows how to parse the points inside a Bezier path (If I remember correctly it actually uses the underlying CGPath object that is inside a Bezier path.) That would be much faster than rebuilding your bezier path each time, but more work for you.