Forms & User Input
Apps live on user input. SwiftUI's Form gives you a polished, settings-style container, and controls like TextField , Toggle , Picker , and Stepper read and write your state through bindings . Wire them up and your screen becomes interactive.
Learn Forms & User Input in our free Swift course — a beginner-friendly interactive lesson with worked examples, a practice exercise and a quick reference.
Part of the free Swift course at LearnCodingFast — hands-on lessons with examples you run in your browser, plus practice exercises and a quick quiz.
Building iOS Apps with SwiftUI • Intermediate
What You'll Learn in This Lesson
1️⃣ Form & Section
Form arranges controls into a scrollable, settings-style layout. Group related controls with Section , optionally adding a header. SwiftUI handles all the styling.
2️⃣ TextField — Capturing Text
TextField binds to a String via the $ prefix, so typing updates your state live. Modifiers like .keyboardType tune the keyboard, and SecureField hides sensitive input.
3️⃣ Toggle, Picker & Stepper
Toggle binds to a Bool , Picker to a selection (matched by each option's tag ), and Stepper to a number it can increment within a range. All read and write through bindings.
Your turn. Fill in the blanks to wire up a small sign-up form.
Build a Form with two sections. In "Guest" put a TextField for the name. In "Details" put a Picker to choose a room type from three options, a Stepper for the number of nights (1 to 14), and a Toggle for "Include breakfast". Show a live summary Text below that reflects all the bound state.
Practice quiz
What is the Form view used for?
- Drawing charts
- Grouping controls for data entry in a styled, scrollable container
- Networking
- Playing audio
Answer: Grouping controls for data entry in a styled, scrollable container. Form groups input controls into a platform-styled, scrollable settings-like layout.
What does TextField bind to?
- A Bool
- A String (the editable text) via a binding
- An Int only
- Nothing
Answer: A String (the editable text) via a binding. TextField takes a Binding to a String so typing updates your state and vice versa.
Which prefix passes a binding to a control like TextField?
- #
- &
- $ (the projected value)
- @
Answer: $ (the projected value). The $ prefix turns an @State into the Binding the control reads and writes.
What does Toggle bind to?
- A String
- A Double
- An array
- A Bool (on/off state) via a binding
Answer: A Bool (on/off state) via a binding. Toggle reads and writes a Bool through its isOn binding.
What is Picker used for?
- Picking colors only
- Choosing one option from several, bound to a selection
- Cropping images
- Sorting lists
Answer: Choosing one option from several, bound to a selection. Picker lets the user choose one value from a set, bound to a selection property.
What does the selection binding of a Picker track?
- The chosen option's tag/value
- The screen brightness
- The list length
- Nothing
Answer: The chosen option's tag/value. The selection binding holds the currently chosen option, matched to each option's tag.
What does Stepper bind to and do?
- A Bool it toggles
- A numeric value it increments and decrements
- A String it edits
- A date only
Answer: A numeric value it increments and decrements. Stepper increases or decreases a bound numeric value with + and − buttons.
Why does a TextField need a binding rather than a plain value?
- For color
- So edits flow back into your state (two-way)
- To make it faster
- It does not need one
Answer: So edits flow back into your state (two-way). A binding is two-way: the field displays the state and writes the user's edits back to it.
What does the .keyboardType(.emailAddress) modifier do?
- Validates the email
- Shows a keyboard suited to typing an email
- Sends the email
- Encrypts input
Answer: Shows a keyboard suited to typing an email. .keyboardType configures which on-screen keyboard appears for a TextField.
How do you group related controls within a Form?
- Section { ... }
- Group all in a ZStack
- Use Spacer
- You cannot group
Answer: Section { ... }. Wrap related controls in a Section to give a Form visually separated groups with optional headers.