(SwiftUI) How to refresh the count down - swiftui

Question

I want the count down to restart when I enter next quiz. Now the count down just continues. Do you know how to fix this problem? Thank you. Following is the reproducible code.
TemplateView.swift
Since the header and the footer is same for all quizes. I am using the template view to avoid redundancy.
import SwiftUI
struct TemplateView: View {
#ObservedObject var model = TemplateViewModel()
var body: some View {
VStack {
InfoView(model: model)
Text(model.getContent(idx: model.currentIdx))
Image(systemName: "arrowshape.turn.up.right.fill")
.onTapGesture {
if model.currentIdx >= model.data.count-1 {
model.currentIdx = 0
} else {
model.currentIdx += 1
}
}
}
}
}
TemplateViewModel
import Foundation
import SwiftUI
class TemplateViewModel: ObservableObject {
#Published var currentIdx: Int = 0
var data: [QuizModel] = [
QuizModel(prepareSeconds: 10, content: "Answer the short question"),
QuizModel(prepareSeconds: 20, content: "Listen to the audio"),
QuizModel(prepareSeconds: 30, content: "Read the article"),
]
var time: Int {
return data[currentIdx].prepareSeconds
}
func getTime(idx: Int) -> Int {
return data[idx].prepareSeconds
}
func getContent(idx: Int) -> String {
return data[idx].content
}
}
InfoView
import SwiftUI
struct InfoView: View {
#ObservedObject var model: TemplateViewModel
#State var prepareSeconds: Int = 0
private let timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()
init(model: TemplateViewModel) {
self.model = model
self._prepareSeconds = State(initialValue: model.getTime(idx: model.currentIdx))
}
var body: some View {
Text(prepareSeconds.description)
.onReceive(timer, perform: { _ in
if prepareSeconds > 0 {
prepareSeconds -= 1
}
})
}
}
QuizModel.swift
This the data model, prepareSeconds means how many seconds the participant can prepare for this quiz. content is the quiz content.
struct QuizModel {
var prepareSeconds: Int
var content: String
}

Answer 1

The simplest way is to just add an id to InfoView so that it is forced to reset its state when the ID changes:
InfoView(model: model).id(model.currentIdx)
However, architecturally, I'm not sure that makes the most sense. I'd store the timer in your ObservableObject:
struct TemplateView: View {
#ObservedObject var model = TemplateViewModel()
var body: some View {
VStack {
InfoView(model: model)
Text(model.getContent(idx: model.currentIdx))
Image(systemName: "arrowshape.turn.up.right.fill")
.onTapGesture {
if model.currentIdx >= model.data.count-1 {
model.currentIdx = 0
} else {
model.currentIdx += 1
}
model.countDownFrom(seconds: model.getTime(idx: model.currentIdx))
}
}.onAppear {
model.countDownFrom(seconds: model.getTime(idx: model.currentIdx))
}
}
}
class TemplateViewModel: ObservableObject {
#Published var currentIdx: Int = 0
#Published var prepareSeconds: Int = 0
private var cancellable : AnyCancellable?
var data: [QuizModel] = [
QuizModel(prepareSeconds: 10, content: "Answer the short question"),
QuizModel(prepareSeconds: 20, content: "Listen to the audio"),
QuizModel(prepareSeconds: 30, content: "Read the article"),
]
var time: Int {
return data[currentIdx].prepareSeconds
}
func getTime(idx: Int) -> Int {
return data[idx].prepareSeconds
}
func getContent(idx: Int) -> String {
return data[idx].content
}
func countDownFrom(seconds: Int) {
prepareSeconds = seconds
cancellable = Timer.publish(every: 1, on: .main, in: .common).autoconnect().sink(receiveValue: { (_) in
if self.prepareSeconds > 0 {
self.prepareSeconds -= 1
}
})
}
}
struct InfoView: View {
#ObservedObject var model: TemplateViewModel
var body: some View {
Text(model.prepareSeconds.description)
}
}
struct QuizModel {
var prepareSeconds: Int
var content: String
}
More refactoring that could be done, but that'll get you started.