2017-05-08 2 views
2

Ich versuche, wie diese um eine Ansicht gestrichelte Linie mit abgerundeten Ecken zu zeichnen:Eine gestrichelte Linie mit abgerundeten Ecken

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() 
    } 
} 

Das Ergebnis ist:

enter image description here

Wie man dort sehen kann, ist ein Problem mit Ecken, irgendeine Idee, wie man es repariert?

Aktualisiert: Mit @ Jon Rose answerDashedLineView wie folgt aussieht jetzt:

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 
    } 
} 
+0

betrachten Sie die Verwendung eines CAShaperLayer anstelle von DrawRect. Ich habe dies mit CAShaperLayer und einem Pfad implementiert und es scheint gut. –

+0

Können Sie bitte ein Beispiel veröffentlichen? – sash

Antwort

3

ich mit der Verwendung eines CAShapeLayer gute Erfahrungen gemacht haben. Zum Beispiel:

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); 

Als Bonus fast alle CAShapeLayer Eigenschaften sind animierbaren lineDashPhase einschließlich, was bedeutet, Sie können es die Striche aussehen wie werden um das Feld zu bewegen.