前提・実現したいこと
プログラミング初学者です。初めての個人的なアプリ開発として、プレゼン用のシンプルなカウントダウンタイマーを作ろうとしています。SwiftのSwift UIフレームワークを利用して、Xcodeで作業してます。
タイマーの数字を囲むような形で、円形のプログレスバーを配置したのですが、タイマーの数字がカウントダウンされていても、プログレスバーが変化せず、カウントが0になった瞬間にプログレスバーが急に非表示のカウント完了の状態になります。
いろいろ情報を調べ、カウントダウンのController部分を記述するファイルと、UIとして画面に表示するView部分を記述するファイルを分ております。カウントダウンされる数値の同期については、仕組みのファイルでクラスに@ObservableObjectを、プロパティであるカウントダウン数値の変数に@Publishedのキーワードをつけました。さらに、画面表示のファイル側で、仕組み側のクラスをインスタンス化して、@ObservedObjectのキーワードをつけました。結果的に、数字はUI上でもきちんとカウントダウンされ、コンソールにprintコマンドで出力しても問題ありませんが、プログレスバーは変化しません。
自分では間違いが見つけ出せなかったため、ご相談させていただきます。
発生している問題・エラーメッセージ
エラーはありません。
該当のソースコード
Controllerファイルのコード
swift
1import SwiftUI 2 3class CountDownTimer: ObservableObject { 4 // この変数の変化に同期する形でカウントダウンの数字、プログレスバーの表示に動きをつける 5 @Published var counter: CGFloat = 10 6 7 let interval = 1.0 8 9 var timer: Timer? 10 11 func start() { 12 timer = Timer.scheduledTimer(withTimeInterval: interval, repeats: true, block: { _ in 13 self.counter -= 1 14 print(self.counter) 15 16 if self.counter <= 0 { 17 self.timer?.invalidate() 18 self.timer = nil 19 } 20 }) 21 } 22 23 func stop() { 24 self.timer?.invalidate() 25 } 26}
Viewファイルのコード
Swift
1import SwiftUI 2 3struct PresentationView: View { 4 5 @ObservedObject var countDownTimer = CountDownTimer() 6 7 var body: some View { 8 NavigationView { 9 VStack { 10 11 Spacer() 12 13 // カウントダウンタイマー 14 VStack { 15 ZStack { 16 Text(String(format: "%.0f", countDownTimer.counter)) 17 .font(Font.largeTitle.monospacedDigit()) 18 .fontWeight(.light) 19 .padding() 20 21 Circle() 22 .stroke(Color(.systemIndigo), style: StrokeStyle(lineWidth: 20, lineCap: .round, lineJoin: .bevel)) 23 .aspectRatio(contentMode: .fit) 24 .padding() 25 26 Circle().trim(from: 0, to: countDownTimer.counter) 27 .stroke(Color(.systemTeal), style: StrokeStyle(lineWidth: 20, lineCap: .round, lineJoin: .bevel)) 28 .aspectRatio(contentMode: .fit) 29 .rotationEffect(Angle(degrees: -90)) 30 .padding() 31 } 32 33 Spacer() 34 35 // スタートボタンとストップボタン 36 HStack { 37 Button(action: {self.countDownTimer.stop()}) { 38 Text("STOP") 39 .fontWeight(.light) 40 .foregroundColor(.white) 41 }.frame(maxWidth: 75, maxHeight: 75) 42 .padding() 43 .background(Color(.systemIndigo)) 44 .cornerRadius(100) 45 .padding() 46 47 Button(action: {self.countDownTimer.start()}) { 48 Text("START") 49 .fontWeight(.light) 50 .foregroundColor(.white) 51 }.frame(maxWidth: 75, maxHeight: 75) 52 .padding() 53 .background(Color(.systemTeal)) 54 .cornerRadius(100) 55 .padding() 56 57 } 58 59 } 60 } 61 } 62 } 63}
補足情報(FW/ツールのバージョンなど)
Xcode Version 11.5 (11E608c)
Swift 5.2
![guest](/img/icon/icnUserSample.jpg)
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。