Textfield tap is dismissing navigation link in SwiftUI - ios

Question

I'm facing a weird issue with textfields and navigation view/link using SwiftUI
All I do is navigate through views using navigation links and inside the destination view there are some textfields. When I tap on any of them the navigation automatically dismisses.
How can I fix navigation link from dismissing when textfield is tapped on and the keyboard shows up?
var emailLoginButton: some View {
NavigationLink(destination: LoginView(viewModel: .init(mode: .login, isPushed: $viewModel.authViewPushed)), isActive: $viewModel.authViewPushed) {
Button(action: { viewModel.authViewPushed = true }) {
HStack {
Image(systemName: "envelope")
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 20, height: 20)
.foregroundColor(.white)
Text("continue_with_email".localized())
.padding(.horizontal, 20)
}
}
.padding()
.frame(maxWidth: .infinity)
.foregroundColor(.white)
.background(Capsule().fill(Color.primaryPurple))
.shadow(color: Color.black.opacity(0.15), radius: 5, x: 5, y: 5)
.padding(.horizontal)
.padding(.bottom, 20)
}
.isDetailLink(false)
}
// Destination's view textfield which "dismisses" navigationLink
var emailTextField: some View {
HStack {
Image(systemName: "envelope")
.font(.title2)
.foregroundColor(.primary)
.frame(width: 35)
TextField(viewModel.emailPlaceholderText.uppercased(), text: $viewModel.email)
.autocapitalization(.none)
}
.padding()
.background(Color.white.opacity(viewModel.email == stringEmpty ? 0 : 0.12))
.cornerRadius(12)
.padding(.horizontal)
}

Answer 1

There seems to be an issue with iOS 14.5 and up where the tapping of any TextField inside a NavigationLink destination makes the view to pop out to the previous one.
There is a workaround thanks to #SeitenWerk and documented on the Apple Developer Forums
https://developer.apple.com/forums/thread/677333
The solution is simple. Just add an empty NavigationLink next to the one that fails. Interestingly, it logs "Unable to present. Please file a bug." on the debug console but makes things right with the usability of the app
NavigationLink(destination: LoginView()){
Text("LOGIN")
}
NavigationLink(destination: EmptyView()) {
EmptyView()
}
Remember to thank SeitenWerk on the Developer Forums.

Answer 2

After some time of research I've found that NavigationLink closes because authViewPushed parameter in the viewModel becomes false. That happens because viewModel is being recreated because of firstView update. I've faced the same issue and here is the solution:
struct MyView: View {
#StateObject var viewModel = MyViewModel()
var body : some View {
}
}
In this case MyView is being updated but MyViewModel remains the same.

Answer 3

on iOS 15
NavigationView {
//your staff
}
.navigationViewStyle(StackNavigationViewStyle())

Answer 4

This might be one of the most frustrating and egregious examples of "this works everywhere else on every other version of whatever" I've seen of late in SwiftUI. (sigh) I'm reworking the whole workflow on two Views just to support previous versions of iOS which I didn't initially set out to do. Grrrr... Are there any known workarounds that are consistently proven to work?

Answer 5

For me the solution is to force out focus of the text field by focus state:
#FocusState private var nameIsFocused: Bool
TextField("text", text: $text)
.textInputAutocapitalization(.never)
.textContentType(.username).keyboardType(.asciiCapable)
.focused($nameIsFocused)
And then in the button callback
var timer:Timer?
timer?.invalidate()
timer = Timer.scheduledTimer(withTimeInterval: 0.25, repeats: false) { _ in
moveToScreen.toggle(); // here change the state}