SwiftUI: Text Timer, Up and Down

SwiftUI: Text Timer, Up and DownWant to show a Timer in SwiftUI?I originally thought I would have to keep a Timer object myself, or use a TimelineView, but NOPE!The solution is actually really simple!We can do all of those in one line, within construct…


This content originally appeared on Level Up Coding - Medium and was authored by Itsuki

SwiftUI: Text Timer, Up and Down

Want to show a Timer in SwiftUI?

I originally thought I would have to keep a Timer object myself, or use a TimelineView, but NOPE!

The solution is actually really simple!

We can do all of those in one line, within constructing the Text view!

Of course, this is in the case where you do NOT need to control, ie: pause and resume, the timer!

Timer Down

To create a count down timer, we can use the init(timerInterval:pauseTime:countsDown:showsHours:) initializer.

  • timerInterval is the interval between where to run the timer.
  • pauseTime: If present, the date at which to pause the timer. The default is nil which indicates to never pause. (Claimed by the document…)
  • countsDown: Whether to count up or down. The default is true.
  • showsHours: true, the default value, to include an hours component if there are more than 60 minutes left on the timer.
Text(
timerInterval: Date.now...Date(timeInterval: 60, since: .now),
pauseTime: nil,
countsDown: true
)

I found that regardless of whether I set the pauseTime to nil or not, my timer will stop anyway!

By the time I wrote this article!

Is this a SwiftUI bug or was I just misunderstanding the parameter’s usage?

Timer Up

If we want a timer counting up to a specific time, obviously, we can just use the same initializer above, but simply set countsDown to false.

However, if we want something that keeps going forever(?), we will have to use a different initializer.

You might be wondering whether if we can just set the upper bound of the closed range to be something like Date(timeInterval: .greatestFiniteMagnitude, since: .now). I thought about it so I tried it out for you! My app crashed!

So!

What we will be using here is init(_:style:) where the style is a DateStyle to use when displaying the date.

Text(Date(), style: .timer)

Yes! Even shorter! And that’s it!

What’s next?

Find a font you like and apply it to the timer!

SwiftUI Text is super powerful!

Imagine how much more work we would have done if those awesome initializers don’t exist!

Of course, if we do need to pause and resume the timer based on user interactions, we will still have to use a timer and implement the logic and formatting ourselves!

I have been focused on the timer this timer, but there are a lot of other formatting and date styling options available. We can even define a custom Formatter to convert an NSObject instance to the desire string representation!

Thank you for reading and listening to me spreading my SwiftUI love!

Happy timer-ing!


SwiftUI: Text Timer, Up and Down was originally published in Level Up Coding on Medium, where people are continuing the conversation by highlighting and responding to this story.


This content originally appeared on Level Up Coding - Medium and was authored by Itsuki


Print Share Comment Cite Upload Translate Updates
APA

Itsuki | Sciencx (2025-03-07T01:03:25+00:00) SwiftUI: Text Timer, Up and Down. Retrieved from https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/

MLA
" » SwiftUI: Text Timer, Up and Down." Itsuki | Sciencx - Friday March 7, 2025, https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/
HARVARD
Itsuki | Sciencx Friday March 7, 2025 » SwiftUI: Text Timer, Up and Down., viewed ,<https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/>
VANCOUVER
Itsuki | Sciencx - » SwiftUI: Text Timer, Up and Down. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/
CHICAGO
" » SwiftUI: Text Timer, Up and Down." Itsuki | Sciencx - Accessed . https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/
IEEE
" » SwiftUI: Text Timer, Up and Down." Itsuki | Sciencx [Online]. Available: https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/. [Accessed: ]
rf:citation
» SwiftUI: Text Timer, Up and Down | Itsuki | Sciencx | https://www.scien.cx/2025/03/07/swiftui-text-timer-up-and-down/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.