swift - UIBezierPath 并非到处都同样胖并被切断

Question

我正在尝试绘制一条线，其末端附有一条平滑的二次曲线。因此，我正在使用此代码：

import Foundation
import UIKit

class IndicatingView: UIView {
    var path: UIBezierPath!

    override init(frame: CGRect) {
        super.init(frame: frame)
    }

    func createLineWithCurve() {
        path = UIBezierPath()

        path.move(to: CGPoint(x: 0, y: 0))

        path.addLine(to: CGPoint(x: 0, y: self.frame.height - self.frame.width))

        path.addQuadCurve(to: CGPoint(x: self.frame.width, y: self.frame.height), controlPoint: CGPoint(x: 0, y: self.frame.height))
    }

    override func draw(_ rect: CGRect) {
        self.createLineWithCurve()

        path.lineWidth = 3
        // Specify a border (stroke) color.
        UIColor.purple.setStroke()
        path.stroke()
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

我得到的输出看起来已经相当不错了：

但是，正如您所看到的，四边形曲线比正常线更胖。此外，四边形曲线似乎在底部被切断。我该如何解决？我希望路径完全平滑，而不会在某些点看起来更胖或以某种方式被切断。

在此先感谢您的帮助 ：）

Answer 1

问题是您的路径被视图的边界剪裁了。例如，在从 开始的垂直笔划中0, 0，路径的垂直笔划的一半将落在视图的左边缘之外。

您应该使用insetBy(dx:dy:)将描边路径插入线宽的一半，这将确保整个描边将落在bounds视图的范围内。然后使用minX,maxX等产生的插图CGRect来找出CGPoint你的路径的各种。

例如：

class IndicatingView: UIView {
    func lineWithCurve() -> UIBezierPath {
        let lineWidth: CGFloat = 3
        let rect = bounds.insetBy(dx: lineWidth / 2, dy: lineWidth / 2)

        let path = UIBezierPath()
        path.lineWidth = lineWidth
        path.lineCapStyle = .square

        path.move(to: CGPoint(x: rect.minX, y: rect.minY))            
        path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY - rect.width))
        path.addQuadCurve(to: CGPoint(x: rect.maxX, y: rect.maxY), controlPoint: CGPoint(x: rect.minX, y: rect.maxY))

        return path
    }

    override func draw(_ rect: CGRect) {
        UIColor.purple.setStroke()
        lineWithCurve().stroke()
    }
}

这会产生：

Answer 2

在这里您可以看到我的“结果”-> 我将线宽做得更大一点，您可以看到它，它画得很完美；）

Apple 总是精确地在点上绘制，所以如果你在点 0,0 上画一条宽度为 3 的线，一个点是 -1,0，一个点是 0,0，一个点是 1,0