時計アプリの仕様
時計アプリの仕様を下記に記載しました
1 画面に表示される時刻は常に更新され現在の時刻が表示されること
2 画面の中央に
現在の時刻:
⭕️時⭕️分と表示されること
3 Swift UIを用いること
プロジェクトの作成
下記の順番で選択
File > New > Project > iOS > App
InterFaceでSwift UIを選択する
ContentViewについて
表示されるコンテンツの内容を記載できる部分のよう
Text("Hello, world!")
上記のHello, World!をGood Bye, World!に変更するために下記のようにソースを変更する
Text("Good Bye, World!")
なので、まずContentViewに「現在時刻:」を追加する
次に、現在の時刻をContentView内で定義する
var currentTime = Date()
currentTimeにDateDate型のインスタンを付与している
現在時刻の用意ができたので、時間を文字列に変換しテキストとして表示するためのメソッドを作成します
private func formattedTime() -> String {
// 日付を文字列に変換する
let dateFormatter = DateFormatter()
//timeStyleプロパティを利用してフォーマットをhh:mm:ssに変更する
dateFormatter.timeStyle = .medium
// currentTimeにフォーマットを適用した文字列を渡している
return dateFormatter.string(from: currentTime)
}
VstackのTextにメソッドを渡して表示される結果を確認します
現在時刻の表示ができましたが問題が発生しました
問題発生:時間が更新されない
表示したタイミングでの時刻のみが表示され更新されませんでした
常にメソッドを呼び呼び続けることが必要なようです
調べた結果、TimerライブラリのscheduledTimerメソッドを利用することで毎秒処理を行うことができるというものがありました
なので毎秒現在時刻の取得を行いcurrentTimeに渡すメソッドを作成します
また、画面を表示してから毎秒行うため、ロードイベントを作成します
ロードイベントの作成方法は下記です
.onAppear
下記にbodyへ追加するメソッドを記載します
// 画面が表示されたときに実行される処理(ロードイベント)
.onAppear {
// タイマーを起動して1秒ごとにcurrentTimeを更新
let _ = Timer.scheduledTimer(withTimeInterval: 1.0, repeats: true) { _ in
currentTime = Date()
}
}’’’
問題が再度発生
謎のコンパイルエラーが、、、
「Cannot assign to property:'self' is immutable」
原因を調べていたらcurrentTimeに@Stateを使用しておらず、毎秒変数更新しても値が変わらないぞというエラーっぽい?
のでcurrentTimeを下記に変更
@State var currentTime = Date()
仕様通り毎秒時間が更新されました、、、
今回はここまで