Why does my animation only work in a preview? - swift

Question

I have a view representing a timer. It looks like this...
Video with animation...
Video without animation...
As you can see, it has a play/pause button, text for the name, and text for the remaining time. Most importantly, the background represents the percentage of the timer that has elapsed.
When run in a preview, the animation runs smoothly. When run anywhere else, the background jumps to each interval point with no animation.
Here is the background shape…
struct Meter: Shape, Animatable {
init(widthPercentage: CGFloat) {
self.widthPercentage = max(0, widthPercentage)
}
var widthPercentage: CGFloat
var animatableData: CGFloat {
get { widthPercentage }
set { self.widthPercentage = newValue }
}
func path(in rect: CGRect) -> Path {
// create the shape…
}
}
Here is the timer view....
struct TimerRow: View {
#ObservedObject var timer: ReusableTimer
var body: some View {
ZStack(alignment: .leading) {
Meter(widthPercentage: CGFloat(timer.progress))
.foregroundColor(.gray)
.opacity(0.20)
.animation(.linear(duration: 0.01))
HStack {
// Other views...
}
}
}
}
Here is the preview...
struct TimerRow_Previews: PreviewProvider {
static var previews: some View {
TimerRow(timer: ReusableTimer(name: "Timer1",
duration: 10,
timeInterval: 0.01))
.previewLayout(.fixed(width: 400, height: 50))
}
}
Notice that the animation duration in TimerRow is set to match the interval of the timer in the preview.
Here is only relevant parts of ReusableTimer...
class ReusableTimer: ObservableObject, Identifiable {
let id: Int
let name: String
#Published private(set) var counter: TimeInterval = 0
var isRunning: Bool { timer != nil }
private var timer: Timer?
let duration: TimeInterval
private let timeInterval: TimeInterval
func start() {
// ...do some other stuff
timer = Timer(timeInterval: timeInterval, repeats: true) { [weak self] _ in
guard let this = self else { return }
this.counter += this.timeInterval // increment the counter
if this.counter >= this.duration { this.removeTimer() }
}
RunLoop.current.add(timer!, forMode: RunLoop.Mode.default)
}
func pause() {
removeTimer()
}
private func removeTimer() {
// Remove the timer
}
}

Answer 1

90% of the time, I ask the wrong question. My duration gave the appearance that there was no animation taking place, but there was... It was just really fast. So I corrected it to .animation(.linear(duration: 1)).
Why did it look perfect in the preview with the incorrect value? That's still a mystery, but it now works.