Benjamin RD
Benjamin RD

Reputation: 12034

Round start and end of the line for a circle with UIBezierPath

I have a case very similar to Draw circle with UIBezierPath I have this path with UIBezierPath

enter image description here

Just taking focus in the gray circle:

grayView = UIView(frame: CGRect(x: screenWidth * 0.15,
                                        y: 150,
                                        width: screenWidth * 0.7,
                                        height: screenWidth * 0.7 ))

        let layer = CAShapeLayer()
        layer.strokeColor = UIColor.gray.cgColor
        layer.fillColor = UIColor.clear.cgColor
        layer.lineWidth = 32

        let path = UIBezierPath()
        path.addCircle(center: CGPoint(x: grayView.bounds.width / 2,
                                       y: grayView.bounds.height / 2),
                                        radius: screenWidth/3.5,
                                        startAngle: 125,
                                        circlePercentage: 0.8)

        layer.path = path.cgPath

        grayView.layer.addSublayer(layer)
        grayView.setNeedsLayout()

What I'm trying to do is modify the start and the end of the curved gray line and make a rounded start/end, like this:

enter image description here

Can someone help me?

Upvotes: 1

Views: 331

Answers (1)

Rob
Rob

Reputation: 437632

Set the lineCap of the shape layer to .round.

Upvotes: 1

Related Questions