Swift Xcode 中的人工制品绘图线

Question

下面的 class 附加到 UIView 并在手指在屏幕上移动时绘制线条。然而，当从上到下从左到右快速移动手指时，绘图会在改变方向时暂时显示尖锐的边缘。这在设备和模拟器上都会发生。

导致此问题的原因是什么？如何在代码中消除这种人为因素，以便在快速改变方向时只看到光滑的圆形，而不是尖锐的边缘？

class drawLine: UIView
{
var comittedSegments: Int = 0
var points = [CGPoint]()
var committedPath = UIBezierPath()

var drawPath = UIBezierPath()
var incrementalImage: UIImage?

var strokeColor:UIColor?

override func drawRect(rect: CGRect) {
    autoreleasepool {
        incrementalImage?.drawInRect(rect)
        strokeColor = UIColor.darkGrayColor()
        strokeColor?.setStroke()
        drawPath.lineWidth = 20
        drawPath.lineCapStyle = CGLineCap.Round
        drawPath.stroke()
    }
}

override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
    let touch: AnyObject? = touches.first

    comittedSegments = 0
    committedPath.removeAllPoints()
    points.removeAll()

    points.append( touch!.locationInView(self) )
}

override func touchesMoved(touches: Set<UITouch>, withEvent event: UIEvent?) {
    let touch: AnyObject? = touches.first
    let point = touch!.locationInView(self)

    points.append( point )

    if points.count == 5
    {
        points[3] = CGPointMake((points[2].x + points[4].x)/2.0, (points[2].y + points[4].y)/2.0)

        committedPath.moveToPoint(points[0])
        committedPath.addCurveToPoint(points[3], controlPoint1: points[1], controlPoint2: points[2])
        comittedSegments = comittedSegments + 1

            self.setNeedsDisplay()

        points[0] = points[3]
        points[1] = points[4]

        points.removeRange(2...4)

        drawPath = committedPath
    }
    else if points.count > 1
    {

        drawPath = committedPath.copy() as! UIBezierPath

        drawPath.CGPath = committedPath.CGPath

        drawPath.moveToPoint( points[0] )
        for point in points[1..<points.count] {
            drawPath.addLineToPoint(point)
        }

        self.setNeedsDisplay()
    }
}

override func touchesEnded(touches: Set<UITouch>, withEvent event: UIEvent?) {
    self.drawBitmap()
    self.setNeedsDisplay()

    committedPath.removeAllPoints()
    points.removeAll()
}

override func touchesCancelled(touches: Set<UITouch>?, withEvent event: UIEvent?) {
    self.touchesEnded(touches!, withEvent: event)
}

func drawBitmap() {
    UIGraphicsBeginImageContextWithOptions(self.bounds.size, true, 0.0)
    strokeColor?.setStroke()
    if(incrementalImage == nil) {
        let rectPath:UIBezierPath = UIBezierPath(rect: self.bounds)
        UIColor.whiteColor().setFill()
        rectPath.fill()
    }

    incrementalImage?.drawAtPoint(CGPointZero)
    committedPath.stroke()
    incrementalImage = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
}
}

Answer 1

除设置lineCapStyle外，设置lineJoinStyle:

drawPath.lineJoinStyle = .Round
drawPath.lineCapStyle = .Round

Swift Xcode 中的人工制品绘图线

Artefacts drawing lines in Swift Xcode

optimization

drawing

ios

swift