Days 14 – 18 we covered a few more Swift fundamentals before getting a first look at SwiftUI. In Day 16, we saw our first SwiftUI project, a utility to split a restaurant bill.

Today, I completed the Day 19 Challenge. This was my first ever SwiftUI project and I designed it myself. Getting the UI laid out was no big deal, it was very similar to the WeSplit project. I broke it into three sections with a TextField, a couple Pickers, and a Text view. Referring back to the WeSplit project meant it was trivial to get the UI set the way I wanted it. I did have to resort to the “Tips” section of the challenge for some ideas on how to handle the actual conversions. Below is the main body View and I’m purposely not including the code for the finalValue computed property.

var body: some View {
        NavigationView{
            Form{
                Section{
                    TextField("Text", value:$valueToConvert, format:.number)
                        .keyboardType(.decimalPad)
                        .focused($keyboardFocus)
                    
                } header:{
                    Text("Enter a value to convert")
                }
                Section{
                    Picker("Starting Units", selection: $initialUnits){
                        ForEach(listOfUnits, id: \.self){
                            Text("\($0)")
                        }
                    }
                    Picker("Ending Units", selection: $finalUnits){
                        ForEach(listOfUnits, id: \.self){
                            Text("\($0)")
                        }
                    }
                } header:{
                    Text("Enter Units")
                }
                Section{
                    Text(finalValue, format:.number)
                } header:{
                    Text("Converted Value")
                }
            }
            .navigationTitle("Let's Convert")
            .toolbar{
                ToolbarItemGroup(placement: .keyboard){
                    Spacer()
                    Button("Done"){
                        keyboardFocus = false
                    }
                }
            }
        }
    }