100 days of swiftui: 28
https://www.hackingwithswift.com/100/swiftui/28

challenge

1. Replace each VStack in our form with a Section, where the text view is the title of the section. Do you prefer this layout or the VStack layout? It’s your app – you choose!
2. Replace the “Number of cups” stepper with a Picker showing the same range of values.
3. Change the user interface so that it always shows their recommended bedtime using a nice and large font. You should be able to remove the “Calculate” button entirely.

solution

1. VStack을 Section으로 나타내기

        NavigationStack {
            Form {
                Section("When do you want to wake up?") {
                    DatePicker("Enter a time to wake up", selection: $wakeUpTime, displayedComponents: .hourAndMinute)
                        .labelsHidden()
                }
                Section("Desired amount of sleep") {
                    Stepper("\(sleepAmount.formatted()) hour(s)", value: $sleepAmount, in: 5...12, step: 0.5)
                }
                Section("Daily coffee intake") {
                    Stepper("^[\(coffeeAmount) cup](inflect: true)", value: $coffeeAmount, in: 0...20)
                }
            }
            .navigationTitle("Better Rest")
            .toolbar {
                Button(action: {
                    calculateBedTime()
                }, label: {
                    Text("Calculate")
                })
            }
        }

코드 파일
https://github.com/treesofgroo/Ios-BetterRest/commit/fed5484bb61391bdece415463cae1f06a28cb4c5

2. Number of cups Stepper를 Picker로 변경하기
   

                Section("Daily coffee intake") {
                    Picker("coffee amount", selection: $coffeeAmount, content: {
                        ForEach(0..<11) { cup in
                            Text(cup < 2 ? "\(cup) cup" : "\(cup) cups")
                        }
                    })
                    .labelsHidden()

코드 파일
https://github.com/treesofgroo/Ios-BetterRest/commit/2528f449f25b9cd8fdcb822defd1f3ed4fe8bfa3

3. ideal bedtime을 즉각적으로 보여주기
   

변수 recommendedSleepTime을 설정해서 화면 제일 아래에서 alert이 없어도 나타날 수 있게 설정했다.

    var recommendedSleepTime: String {
        do {
            let config = MLModelConfiguration()
            let model = try SleepCalculator(configuration: config)
            
            let components = Calendar.current.dateComponents([.hour, .minute], from: wakeUpTime)
            let hour = (components.hour ?? 0) * 60 * 60
            let minute = (components.minute ?? 0) * 60
            
            let prediction = try model.prediction(wake: Double(hour + minute), estimatedSleep: sleepAmount, coffee: Double(coffeeAmount))
            let sleepTime = wakeUpTime - prediction.actualSleep
            
            return sleepTime.formatted(date: .omitted, time: .shortened)
            
        } catch {
            return "Sorry, there was a problem calculating your bedtime."
        }
    }

코드 파일
https://github.com/treesofgroo/Ios-BetterRest/commit/cc5ee08dc43494e91a61ed210431c209c55ed70f