時間ピッカー SwiftUI watchOS

こんな感じで作って

struct TimePicker: View {
    @State private var selectedHour = 0
    @State private var selectedMin = 0
    @State private var selectedSecond = 0

    let height: CGFloat = 100.0
    
    var body: some View {
        HStack {
            VStack {
                Picker(selection: self.$selectedHour, label: Text("Hour")) {
                    ForEach(0..<24) { hour in
                        Text(String(format: "%02d", hour))
                    }
                }
            }
            .frame(height: height)
            .clipped()
            .border(Color.blue)

            VStack {
                Picker(selection: self.$selectedMin, label: Text("Min")) {
                    ForEach(0..<60) { min in
                        Text(String(format: "%02d", min))
                    }
                }
            }
            .frame(height: height)
            .clipped()
            .border(Color.blue)

            VStack {
                Picker(selection: self.$selectedSecond, label: Text("Sec")) {
                    ForEach(0..<60) { sec in
                        Text(String(format: "%02d", sec))
                    }
                }
            }
            .frame(height: height)
            .clipped()
            .border(Color.blue)
        }
    }
}

TimePicker()を使う。 2桁の数字。

Text(":")

みたいに間に挟むのもあり。

SwiftUI watchOSでタイマー

zenn.dev

これ使うのにTARGETのここ2つは7.0にしておく必要があり。

SwiftUIで時間ピッカー

stackoverflow.com

これなら大きさ調整すればwatchOSでも動くが、はみ出る。しかもドラムが動かない。

プルダウン SwiftUI AppleWatch watchOS

https://stackoverflow.com/questions/57091718/how-to-display-a-picker-in-swiftui-completely-in-a-scrollview-or-vstack-with-oth これみた

以下を定義して

    @State private var exercises = ["Unterarmstütz", "Dehnen", "Kopfstand", "Handstand"]
    @State private var selectedExercise = "Plank"

これやる

                // use GeometryReader for height & weight
                GeometryReader { geometry in
                    ScrollView() {
                        ForEach(self.exercises, id: \.self) { exercise in
                        Button(action: {
                        self.selectedExercise = String(exercise)
                            }) {
                                Text(exercise)
                            }
                        }
                    }
                }.frame(
                    height: 50, alignment: .center
                )

色もつく

                // use GeometryReader for height & weight
                GeometryReader { geometry in
                    ScrollView() {
                        ForEach(self.exercises, id: \.self) { exercise in
                            Button(action: {
                                self.selectedExercise = exercise
                                    }) {
                                        Text(exercise)
                                    }.foregroundColor(self.selectedExercise == exercise ? .green : .white)
                        }
                    }
                }.frame(
                    height: 50, alignment: .center
                )

Apple Watch（watchOS）のためにCarthage入れ

https://github.com/calda/WatchKitTimePicker これ使いたいけど、CocoaPodではなくてCarthage（カルタゴ）

brew install carthage

carthage bootstrap --platform watchOS

してから

carthage update --platform watchOS