6

Is there a way to change the output format of a Text using init(_ date: Date, style: Text.DateStyle)?

Using a .timer, the output is like: 0:42, but I want something like 00:00:42.


Background

I want to create a widget (iOS 14) where a timer is running, and as I think it's not a good idea to trigger a widget update every second, and this may even also not work reliably, at least that's not how widget are indented to be used. So I thought about using this predefined timer functionality of Text.

I'm quite new to SwiftUI and don't really know about all the capabilities yet. So maybe I could create a similar custom Text-View by myself? Any ideas on how to achieve this?

Or asked differently: Is there a way to create such self-updating components by oneself, that also work in an iOS 14 widget? (Seems like using Timer.publish to update the View does not work in an iOS 14 widget)

d4Rk
  • 6,622
  • 5
  • 46
  • 60

1 Answers1

0

No solution => Workaround

As of today, there doesn't seem to be a proper solution for this. But as the interest in a "solution" or workaround for this seems to be there, I'll just post what I ended up with, for now.

Code

Basically I just manually update the Text once a second, and calculate the difference from the reference date to "now".

struct SomeView: View {
    let referenceDate = Date() // <- Put your start date here

    @State var duration: Int = 0
    let timer = Timer.publish(every: 1, on: .current, in: .common).autoconnect()
    
    var body: some View {
        Text(self.duration.formatted(allowedUnits: [.hour, .minute, .second]) ?? "")
            .onReceive(self.timer) { _ in
                self.duration = referenceDate.durationToNow ?? 0
            }

    }
}

extension Date {
    var durationToNow: Int? {
        return Calendar.current
            .dateComponents([.second], from: self, to: Date())
            .second
    }
}

extension Int {
    func formatted(allowedUnits: NSCalendar.Unit = [.hour, .minute]) -> String? {
        let formatter = DateComponentsFormatter()
        formatter.allowedUnits = allowedUnits
        formatter.zeroFormattingBehavior = .pad
        return formatter.string(from: DateComponents(second: self))
    }
}

WidgetKit limitations

This unfortunately does not work for WidgetKit, as the timer does not run or at least the UI does not refresh. So I ended up, only displaying minutes in the widget (which is kinda ok for my purpose) and just set an update in the "timeline" for each minute.

d4Rk
  • 6,622
  • 5
  • 46
  • 60
  • 2
    I am trying to create a clock widget and having hour and minutes is enough for me and I think your solution would be really good but I can't make it work with the code above, would you please share the code to achieve this (hours and minutes) for widgetKit? – Sasan Soroush Oct 29 '20 at 19:52