How it works
FocusState is a property wrapper that connects a value in your view to the focus state of the system. SwiftUI keeps that property synchronized with which control currently has keyboard focus, so you can both read where focus is and move it programmatically. Reach for FocusState when you need to know whether a particular field is being edited, or when you want to direct focus yourself — for example, to place the cursor in a text field as a screen appears or after the user taps a button.
Declare the focus binding with @FocusState
Annotate a property with @FocusState to let SwiftUI own and update it as focus changes. A Bool-typed binding, like
@FocusState private var nameFocused: Bool, tracks a single focusable control: SwiftUI sets it to true while that control holds focus and false otherwise. (For multiple targets you'd use an enum or optional value instead.)Bind a control to the state with focused()
Apply the
.focused($nameFocused)modifier to a focusable view to tie it to the wrapped value. Passing the projected$nameFocusedbinding tells SwiftUI to flipnameFocusedto true when this control — here theTextField— gains focus and back to false when it loses it.Read focus to drive your UI
Because the wrapper's value updates with the system, you can read it like any state to react to focus. The example branches on
nameFocusedto swap the prompt between"Editing…"and"Tap the field"and to change the.foregroundColor, so the interface responds the moment the field is selected or deselected.Move focus programmatically by writing the value
Assigning to the wrapped property pushes focus the other direction: set it and SwiftUI focuses the bound control. The
Button("Focus")does exactly this withnameFocused = true, which activates theTextFieldand brings up the keyboard without the user tapping the field.
.onAppear { nameFocused = true } to the VStack so the TextField claims focus the instant the view appears, demonstrating how writing the FocusState value drives focus.Example & preview
Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.
struct FocusStateDemo: View {
@FocusState private var nameFocused: Bool
@State private var name = ""
var body: some View {
VStack(spacing: 16) {
TextField("Your name", text: $name)
.textFieldStyle(.roundedBorder)
.focused($nameFocused)
Text(nameFocused ? "Editing…" : "Tap the field")
.foregroundColor(nameFocused ? .blue : .secondary)
Button("Focus") { nameFocused = true }
}
.padding()
}
}