[SwiftUI]リアルタイム日時を表示する方法

今回作成するアプリ

リアルタイムに日時を表示する方法です。以下のようなものが作れます。

環境

・ macOS: Monterey
・ Xcode: 13.2

実装

日時を表示させるプロパティとDateを入れるプロパティの作成をします。
DateFormatterはインスタンス化します

@State var nowDate = Date()
@State var dateText = ""
private let dateFormatter = DateFormatter()

つづいてイニシャライザで以下のようにdateFormatを初期設定していきます

init() {
    dateFormatter.dateFormat = "YYYY/MM/dd(E) \nHH:mm:ss"
    dateFormatter.locale = Locale(identifier: "ja_jp")
    }

Textで日時を表示します

Text(dateText))

この状態でプレビューを再生してみると、再生した時の日時が表示され、そこから時間は動きません
リアルタイムの時間を表示させるには毎秒毎にDateを更新していく必要がありますので以下を追加します

.onAppear {
    Timer.scheduledTimer(withTimeInterval: 1, repeats: true) { _ in
        self.nowDate = Date()
        dateText = "\(dateFormatter.string(from: nowDate))"
    }
}

これで毎秒Viewが更新され、リアルタイムな日時が表示されます。
しかし、画面を開いた1秒後にしか日時が表示されませんのでTextを以下のように書きかえます

Text(dateText.isEmpty ? "\(dateFormatter.string(from: nowDate))" : dateText)

これで表示した瞬間から自然にリアルタイムな日時が表示されます

まとめ

全体のコードはこれだけです

@State var dateText = ""
@State var nowDate = Date()
private let dateFormatter = DateFormatter()
init() {
    dateFormatter.dateFormat = "YYYY/MM/dd(E) \nHH:mm:ss"
    dateFormatter.locale = Locale(identifier: "ja_jp")
}
var body: some View {
	Text(dateText.isEmpty ? "\(dateFormatter.string(from: nowDate))" : dateText)
	.onAppear {
	Timer.scheduledTimer(withTimeInterval: 1, repeats: true) { _ in
            self.nowDate = Date()
            dateText = "\(dateFormatter.string(from: nowDate))"
        }
    }
}