How to hide the keyboard in Swift by pressing the return key?


In this article, you will learn about how you can hide the keyboard while editing text in the UITextField. In this example, you will hide the keyboard by pressing the return button on the keyboard.

In the Swift language, UITextField class provides us with some delegate methods. They called on different actions or events. We will implement one of the delegate methods to hide the keyboard. Also, you will see how to change the return type if required.

In this example, we will hide the keyboard in UITextField to enter an email address by following the below steps −

Step 1 − In this step, will create and customize the UITextField object to enter the email address.

Step 2 − In this step, will conform the UITextField’s delegate and implement the textFieldShouldReturn method to hide the keyboard.

Example

import UIKit
class TestController: UIViewController {
   private let emailTextField = UITextField()
   override func viewDidLoad() {
      super.viewDidLoad()
      initialSetup()
   }
   private func initialSetup() {
      // basic setup
      view.backgroundColor = .white
      navigationItem.title = "UITextField"
        
      // emailTextField customization
      emailTextField.keyboardType = .emailAddress
      emailTextField.layer.cornerRadius = 8
      emailTextField.backgroundColor = UIColor(white: 0, alpha: 0.1)
      emailTextField.placeholder = "Enter email address"
      emailTextField.textAlignment = .center
      emailTextField.autocorrectionType = .no
      emailTextField.autocapitalizationType = .none
      emailTextField.returnKeyType = .done
        
      // adding the constraints to emailTextField
      view.addSubview(emailTextField)
      emailTextField.translatesAutoresizingMaskIntoConstraints = false
      emailTextField.heightAnchor.constraint(equalToConstant: 50).isActive = true
      emailTextField.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 30).isActive = true
      emailTextField.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: -30).isActive = true
      emailTextField.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 50).isActive = true
   }
}

Output

When you run the above code, the below output screen will appear with the input field to enter the email address −

When you press the return button, nothing happens. We want the keyboard to disappear when the return key is pressed. Let's carry out the keyboard-hiding procedure.

Set UITextField Delegate

To get the callback on clicking the return button, you must have to set the delegate property and implement the required method.

emailTextField.delegate = self

Use the above line of code in the last line of the method initialSetup() after adding the constraints. Here, you are assigning self to the delegate property of emailTextField to implement the methods in the same controller.

Once you run the application after adding the delegate property, you will get an error like below −

Add missing conformance to 'UITextFieldDelegate' to class 'TestController'

According to the above error, the required delegate methods are missing from TestController. Let's implement the delegate method like this −

extension TestController: UITextFieldDelegate {
   func textFieldShouldReturn(_ textField: UITextField) -> Bool {
      textField.resignFirstResponder()
   }
}

In this example, the textFieldShouldReturn delegate method is called when the return key is pressed. The resignFirstResponder() method is called on the text field, which causes the keyboard to be dismissed.

Conclusion

In conclusion, you can change the return type of the button using the returnKeyType property to the done type. Now, you can assign the delegate property to the text field and implement the methods. You need to implement the textFieldShouldReturn method to dismiss the keyboard.

You can call the resignFirstResponder() method in the delegate method to resign the keyboard. This method returns a boolean type i.e. true after successfully dismissing the keyboard. It is necessary to set the delegate property in order to call the delegate methods.

Updated on: 28-Feb-2023

2K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements