CAShapeLayer线条的圆角

Question

我想要在视图中绘制带有圆角的对角线。

我的代码：

class DiagonalView: UIView {

// MARK: - Public Properties

@IBInspectable var fillColor: UIColor = UIColor.white {
    didSet {
        self.diagonalLayer.strokeColor = fillColor.cgColor
        self.redraw()
    }
}

@IBInspectable var lineWidth: CGFloat = 1 {
    didSet {
        self.diagonalLayer.lineWidth = lineWidth
        self.redraw()
    }
}

// MARK: - Private Properties

private var diagonalLayer: CAShapeLayer = {
    let layer = CAShapeLayer()
    layer.fillColor = UIColor.clear.cgColor
    layer.strokeColor = UIColor.white.cgColor
    layer.lineCap = kCALineCapRound
    layer.lineWidth = 1
    return layer
}()

// MARK: - Constructors

override func awakeFromNib() {
    super.awakeFromNib()
    self.layer.addSublayer(self.diagonalLayer)
    self.setupPath()
}

override func layoutSubviews() {
    super.layoutSubviews()
    self.setupPath()
}

// MARK: - Private methods

private func redraw() {
    self.setNeedsDisplay()
}

private func setupPath() {
    let startPoint = CGPoint(x: self.frame.width, y: 0)
    let endPoint = CGPoint(x: 0, y: self.frame.height)
    let path = UIBezierPath()
    path.move(to: startPoint)
    path.addLine(to: endPoint)
    path.close()
    self.diagonalLayer.path = path.cgPath
}

}

线条位置正确，但是圆角没有实现。

代码看起来不错，但我觉得可能弄错了什么……有什么建议吗？

- RomanHouse

---

我以前没有尝试过在形状图层上实现圆角端点。形状图层具有与路径线帽样式不同的线帽样式，这似乎很奇怪。如果您将CGPath的线帽样式设置为圆角，并将其安装到形状图层中，会发生什么呢？ - Duncan C

Answer 1

我认为我找到了问题所在。文档中说：

线帽样式指定打印路径的开放端点的形状。

您现在正在关闭路径，请保持路径开放。

- Duncan C