100 Days of SwiftUI

Day 17

2026-05-05

Project 1, part two

Getting into the project itself now, which is a “check-splitting” app — how much was the meal (Double), how much tip to leave as a percentage (Int), and how many people to split it with (Int).

Reading text from the user with TextField

  • the user needs to tell us 3 things, and they should be @State variables
  • tip percentage is a fixed array in this example, which is not what I would find useful but it is just an exercise
  • TextField input looks for a string, but we want a Double so we need to modify the syntax a bit TextField("Amount", value: $checkAmount, format: .currency(code: "USD"))
  • then rather than force “USD” on the user, use Locale (a built in struct) to query the user’s region settings
  • you can include a number-only keyboard for the amount field
  • I figured out how to run the simulator, sorta. Might benefit from a side class in that…
I can’t seem to bring up the keyboard on the preview though

Creating pickers in a form

What you’re seeing here is the importance of what’s called declarative user interface design. This means we say what we want rather than say how it should be done. We said we wanted a navigation link picker with some values inside, but we didn’t have to say “now create a list of all our items, showing a checkmark to whichever is selected right now.”

This is pretty much the opposite to how PowerApps work.

Ah, and this at least addresses my question from yesterday, even if I still don’t quite understand it

Tip: It’s tempting to think that modifier should be attached to the end of the NavigationStack, but it needs to be attached to the end of the Form instead. The reason is that navigation stacks are capable of showing many views as your program runs, so by attaching the title to the thing inside the navigation stack we’re allowing iOS to change titles freely.

Adding a segmented control for tip percentages

  • segmented control is useful if there only a few options — it turns the array into a horizongal bar of choices Segmented control

Calculating the total per person

There are some shenanigans going on with the number of people picker. We set the default to be 2, and the ForEach that constructs the menu goes from 2..<100. The “Number of people” then shows “4 people” as the default, which seems like the ListIndex[2]. I made that up, but how it’s used feels like an array.

So then in our total calculation we have let peopleCount = Double(numberOfPeople + 2) which definitely feels like we’re using some sort of index that just happens to work out.

This is unsatisfying.

Hiding the keyboard

  • number and decimal keypads don’t have a “return” like an alphabetic keybaord does, so nothing dismisses them
  • need to use the @FocusState property wrapper