swift - 带有圆角的虚线

This question already has answers here:

CoreGraphics line appears to change size?

(2个答案)


3年前关闭。




我试图围绕这样的 View 绘制带有圆角的虚线:

class DashedLineView: UIView {

    override func draw(_ rect: CGRect) {

        let path = UIBezierPath(roundedRect: rect, cornerRadius: 8)

        UIColor.clear.setFill()
        path.fill()

        UIColor.red.setStroke()
        path.lineWidth = 3

        let dashPattern : [CGFloat] = [3, 3]
        path.setLineDash(dashPattern, count: 2, phase: 0)
        path.stroke()
    }
}

结果是:



如您所见，拐角存在问题，您知道如何解决吗？

更新:
现在使用@Jon Rose answer DashedLineView看起来像这样:

class DashedLineView: UIView {

    private let borderLayer = CAShapeLayer()

    override func awakeFromNib() {

        super.awakeFromNib()

        borderLayer.strokeColor = UIColor.red.cgColor
        borderLayer.lineDashPattern = [3,3]
        borderLayer.backgroundColor = UIColor.clear.cgColor
        borderLayer.fillColor = UIColor.clear.cgColor

        layer.addSublayer(borderLayer)
    }

    override func draw(_ rect: CGRect) {

        borderLayer.path = UIBezierPath(roundedRect: rect, cornerRadius: 8).cgPath
    }
}

最佳答案

我在使用CAShapeLayer方面有丰富的经验。例如:

let rect = CGRect.init(origin: CGPoint.init(x: 20, y: 100), size: CGSize.init(width: 200, height: 100))
let layer = CAShapeLayer.init()
let path = UIBezierPath(roundedRect: rect, cornerRadius: 8)
layer.path = path.cgPath;
layer.strokeColor = UIColor.red.cgColor;
layer.lineDashPattern = [3,3];
layer.backgroundColor = UIColor.clear.cgColor;
layer.fillColor = UIColor.clear.cgColor;
self.view.layer.addSublayer(layer);

值得一提的是，几乎所有CAShapeLayer的属性都可以设置动画，包括lineDashPhase，这意味着您可以使虚线看起来像在盒子周围移动一样。

关于swift - 带有圆角的虚线，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43847670/