Implementing a progress ring

Admit it – since you bought your Apple Watch, you are getting fitter, aren't you? I bet it is because of the activity rings you want to close every day. Am I right?In this recipe, we will implement a progress ring like those on the Apple Watch, and we will change its value via some sliders.

Getting ready

You don't need to prepare anything for this recipe; just create a SwiftUI project called ProgressRings.

How to do it…

We are going to implement two components:

• A single ProgressRing View
• A composite RingsView

We'll add the latter to ContentView, and we will simulate progress using three sliders.To do this, follow these steps:

1. Implement a ring view using a Shape object and an arc:

struct ProgressRing: Shape {
    private let startAngle = Angle.radians(1.5 * .pi)
    
    var progress: Double
    
    func path(in rect: CGRect) -> Path {
        Path() { path in
            path.addArc(
                center: CGPoint...