When using a VStack containing two TextFields inside a ScrollView on an iPad running iOS 18.0, the FocusState of the topmost TextField does not trigger, while the second TextField's FocusState works correctly. Adding an invisible TextField on top resolves the issue, but it appears to be a bug specifically in iOS 18.0 on iPads. This issue does not occur on iOS versions below or above 18.0 (including iOS 18.1).
Code that is not working
struct ContentView: View {
@State var text: String = ""
@FocusState
private var focusState: Bool
var body: some View {
ScrollView(.vertical, content: {
VStack(spacing: 0) {
TextField(text: $text) {
Text("Hello, World!")
}
.border(focusState ? Color.red : Color.gray)
.focused($focusState)
.onChange(of: focusState) { oldValue, newValue in
print(newValue)
}
.onChange(of: text) { oldValue, newValue in
focusState = true
}
}
})
.padding()
}
}
Code that is working
struct ContentView: View {
@State var text: String = ""
@FocusState
private var focusState: Bool
var body: some View {
ScrollView(.vertical, content: {
VStack(spacing: 0) {
// Invisible Text Field
TextField("", text: .constant(""))
.frame(height: 0)
TextField(text: $text) {
Text("Hello, World!")
}
.border(focusState ? Color.red : Color.gray)
.focused($focusState)
.onChange(of: focusState) { oldValue, newValue in
print(newValue)
}
.onChange(of: text) { oldValue, newValue in
focusState = true
}
}
})
.padding()
}
}