SwiftUI: How to dismiss the keyboard by tap on NavigationLink?

Question

Alse OP

Created Dec ’19

Replies 4

Boosts 0

Views 8.9k

Participants 6

Hi,

I have TextField and a list with buttons NavigationLink.

When i tap on NavigationLink i need to dismiss the keyboard, how?

Thanks in advance.

 import SwiftUI
 
struct ContentView: View {
   let array = ["John","Lena","Steve","Chris","Catalina"]
 
        @State private var searchText = ""
 
        var body: some View {
 
 
            NavigationView{
              List{
                  TextField("Type your search",text: $searchText)
                      .textFieldStyle(RoundedBorderTextFieldStyle())
 
                  ForEach(array.filter{$0.hasPrefix(searchText) || searchText == ""}, id:\.self){names in
                    NavigationLink(destination:keyboardDissmis(text: names)){
                        Text(names)
                      }
                  }
              }
              .navigationBarTitle(Text("Search"))
          }
            .gesture(DragGesture().onChanged{_ in UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to:nil, from:nil, for:nil)})
           
    }
}
 
func keyboardDissmis(text:String)->Text{
    UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to:nil, from:nil, for:nil)
   
    return Text(text)
}
 
 
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Boost

Answer 1

scotteg OP

Feb ’20

One way to do this is by adding this extension to `UIView`:

 extension UIView {
    open override func touchesBegan(_ touches: Set, with event: UIEvent?) {
        super.touchesBegan(touches, with: event)
        UIApplication.shared.windows
            .first { $0.isKeyWindow }?
            .endEditing(true)
    }
}

1

Answer 2

sprykly OP

Jul ’20

Works in Xcode 12 beta

Code Block swiftimport SwiftUIstruct ContentView: View {	...	var body: some View {		NavigationView {			...		}		.onTapGesture {			hideKeyboard()		}	}}#if canImport(UIKit)extension View {    func hideKeyboard() {        UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)    }}#endif

1

Answer 3

steve_mcc OP

Apr ’21

This does work, however...
It seems to have a side effect of making a segmented picker inside the nav view unresponsive. (Oddly, a Toggle control does still work.)
Bug or feature I'm not sure.

I've tried the onTapGesture at different levels and also tried onDisappear, none of which resolved the issue.

xcode 12.4/iOS 14.1

0

Answer 4

mcebey OP

Sep ’21

You can create an extension of View with the hideKeyboard like sprykly said.

 extension View {   
  func hideKeyboard() {
      UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
  }
}

Then in your view:

 struct MyViewCell: View {
    @State var navigate = false
    
    var body: some View {
        ZStack {
          
            NavigationLink(destination: DestinyView()), isActive: $navigate) {
                EmptyView()
            }
            .hidden()
            .buttonStyle(PlainButtonStyle())
           
            VStack {
                ContentOfView()
               
            }.onTapGesture {
                hideKeyboard()
                navigate = true
            }
        } 
    }
}

Used in SwiftUI1

1

	import SwiftUI

	struct ContentView: View {
	let array = ["John","Lena","Steve","Chris","Catalina"]

	@State private var searchText = ""

	var body: some View {


	NavigationView{
	List{
	TextField("Type your search",text: $searchText)
	.textFieldStyle(RoundedBorderTextFieldStyle())

	ForEach(array.filter{$0.hasPrefix(searchText) \|\| searchText == ""}, id:\.self){names in
	NavigationLink(destination:keyboardDissmis(text: names)){
	Text(names)
	}
	}
	}
	.navigationBarTitle(Text("Search"))
	}
	.gesture(DragGesture().onChanged{_ in UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to:nil, from:nil, for:nil)})

	}
	}

	func keyboardDissmis(text:String)->Text{
	UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to:nil, from:nil, for:nil)

	return Text(text)
	}


	struct ContentView_Previews: PreviewProvider {
	static var previews: some View {
	ContentView()
	}
	}

	extension UIView {
	open override func touchesBegan(_ touches: Set, with event: UIEvent?) {
	super.touchesBegan(touches, with: event)
	UIApplication.shared.windows
	.first { $0.isKeyWindow }?
	.endEditing(true)
	}
	}

	extension View {
	func hideKeyboard() {
	UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
	}
	}

	struct MyViewCell: View {
	@State var navigate = false

	var body: some View {
	ZStack {

	NavigationLink(destination: DestinyView()), isActive: $navigate) {
	EmptyView()
	}
	.hidden()
	.buttonStyle(PlainButtonStyle())

	VStack {
	ContentOfView()

	}.onTapGesture {
	hideKeyboard()
	navigate = true
	}
	}
	}
	}