I am making a timer but am unsure of how to pause it when the button is triggered. I have attempted to make a boolean @State but I am yet unsure how to pause the timer when the button is triggered. Please review my code below...

struct TestView: View {
    @State var isTimeStarted = false
    @State var to: CGFloat = 0
    @State var timeDuration = 60
    @State var time = Timer.publish(every: 1, on: .main, in: .common).autoconnect()
    @State var isPaused = false
    @State private var count = 0
    var body: some View {
        ZStack {
            VStack {
                ZStack {
                    Circle()
                        .trim(from: 0, to: self.to)
                        .stroke(LinearGradient(gradient: Gradient(colors: [Color.white, Color.white.opacity(0.2)]), startPoint: .topLeading, endPoint: .bottomTrailing), style: StrokeStyle(lineWidth: 15.6, lineCap: .round))
                        .shadow(radius: 8)
                        .rotationEffect(.degrees(90))
                        .rotation3DEffect(Angle(degrees: 180), axis: (x: 1, y: 0, z: 110))
                        .frame(width: 70, height: 70)
                        .animation(.easeOut)
                        .padding()
                        .padding(.leading, 10)
                    Text("\(self.timeDuration, specifier: formatTime())")
                        .font(.system(size: 17.5, design: .rounded))
                        .fontWeight(.semibold)
                        .foregroundColor(.white)
                        .padding(.leading, 10)
                }
                Button {
                    isPaused = true
                } label: {
                    ZStack {
                        BlurView2(style: .systemThinMaterialDark)
                            .frame(width: 145, height: 45)
                            .background(Color.yellow)
                            .cornerRadius(30)
                            .padding(.horizontal)
                        Image(systemName: "pause")
                            .font(.title2)
                            .shadow(radius: 10)
                            .foregroundColor(.yellow)
                    }
                }
            }
        }
        .preferredColorScheme(.dark)
        .onAppear {
            self.timeDuration = 60
            withAnimation(.default) {
                self.to = 60
            }
            self.isTimeStarted = true
        }
        .onReceive(self.time, perform: { _ in
            if self.timeDuration != 0 {
                self.timeDuration -= 1
                withAnimation(.default) {
                    self.to = CGFloat(self.timeDuration)/60
                }
            } else {
                self.timeDuration = 60
                self.to = 60
            }
        })
    }
    func formatTime() -> String {
        let minutes = Int(timeDuration) / 60 % 60
        let seconds = Int(timeDuration) % 60
        return String(format: "i:i", minutes,seconds)
    }
}

struct BlurView2: UIViewRepresentable {
    var style: UIBlurEffect.Style
    func makeUIView(context: Context) -> UIVisualEffectView {
        let view = UIVisualEffectView(effect: UIBlurEffect(style: style))
        return view
    }
    func updateUIView(_ uiView: UIVisualEffectView, context: Context) {
        
    }
}

CodePudding user response：

Thi should be pretty simple. Keep your timer firing but return in your function if it should pause.

Add this to the start of your .onReceive function:

if isPaused{
    return
}

and change your Button to:

isPaused.toggle()