SwiftUIで作るタイマーアプリで、料理中に時間に対する不安を解消しよう！

2023-11-10 18:05:07

週がくると、冷蔵庫いっぱいの食材とピカピカに掃除したキッチンに申し訳が立たず、必ず自宅で料理を作ることになる。シーフード調理では、時間を正確に計ることが必須だ。茹で過ぎると美味しくなく、茹で時間が短すぎると生焼けになってしまう。そこで登場するのがタイマーアプリだ。料理中の...

料理をしながら時間を管理するためのSwiftUIタイマーアプリを作ろう

週末はいつも家で料理をして、冷蔵庫いっぱいの食材とピカピカに掃除したキッチンを無駄にしないようにしている。シーフードを調理するときは、正確な計時が不可欠だ。茹ですぎると美味しくなくなるし、茹で時間が短すぎると生焼けになる。そんなときに役立つのがタイマーアプリだ。

このアプリを使えば、シーフードを完璧に調理して、茹ですぎや生焼けを防ぐことができる。この記事では、SwiftUIを使ってタイマーアプリを作成する方法を説明する。

アプリの構築

Xcodeで新しいSwiftUIプロジェクトを作成する。
ContentView.swiftファイルを開く。
次のコードをContentView構造体に貼り付ける。

import SwiftUI

struct ContentView: View {
    @State private var timerValue = 600 // タイマーの初期値（10分）
    @State private var timerRunning = false // タイマーの動作状態

    var body: some View {
        VStack {
            Text("タイマー")
                .font(.largeTitle)
                .padding()

            Text("\(timerValue)")
                .font(.title)
                .padding()

            Button(action: {
                // タイマーの開始・停止
                timerRunning.toggle()
            }) {
                Text(timerRunning ? "停止" : "開始")
            }
            .padding()
        }
        .onReceive(Timer.publish(every: 1, on: .main, in: .common).autoconnect()) { _ in
            // タイマーの更新
            if timerRunning {
                timerValue -= 1
                if timerValue == 0 {
                    // タイマーが完了したときの処理
                }
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}