他の場所をタップした時にキーボードを閉じる方法 (Swift)

UITextField などに入力した後、画面の他の場所をタップしたらキーボードが閉じて欲しい時があると思います。

今回は、次のような感じで、Swift で画面の他の場所をタップした時にキーボードを閉じる方法をご説明します。

テスト用のアプリを作る

まずはテスト用に簡単なアプリを作ります。

Xcode で [iOS] の [App] の新規プロジェクトを作成してください。

ストーリーボードでデザインは適当でも良いので、以下のように Text Field と Button を追加してください。

そして、ViewController.swift に以下のように、ボタンのイベントがちゃんと起こるかを確認するために、Button の TouchUpInside のアクションを作っておいてください。

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    @IBAction func okButtonTapped(_ sender: Any) {
        print("Tapped!!")
    }
}

他の場所をタップした時にキーボードが閉じるようにする方法

それでは、Swift で画面の他の場所をタップした時にキーボードを閉じる方法をご説明します。

キーボードを閉じるには何通りか方法がありますが、ここでは UITapGestureRecognizer を使った方法をご紹介します。

view の endEditing() というメソッドを実行すると、階層の中のテキストフィールドなどにファーストレスポンダーのものがあるかを確認し、あった場合は、resignFirstResponder() メソッドを実行してくれ、結果キーボードが閉じられます。

UITapGestureRecognizer を使って、画面のどこかがタップされた時に、その endEditing() メソッドが実行されるようにします。

ViewController.swift に次のコードを追加してください。

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    
        let tapGR: UITapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(dismissKeyboard))
        tapGR.cancelsTouchesInView = false
        self.view.addGestureRecognizer(tapGR)
    }
    
    @objc func dismissKeyboard() {
        self.view.endEditing(true)
    }
    
    @IBAction func okButtonTapped(_ sender: Any) {
        print("Tapped!!")
    }
}

6 行目では、画面のどこかがタップされた時に dismissKeyboard() 関数が呼ばれるような、UITapGestureRecognizer を定義しています。

7 行目では、UITapGestureRecognizer がジェスチャーを受け取った以降のタップ関連のイベントも実行されるように、cancelsTouchesInView を false に設定しています。

8 行目で ViewController の View に、生成した UITapGestureRecognizer を追加しています。これで画面のどこかをタップした時に、dismissKeyboard() 関数が実行されます。

11 ~ 13 行目の dismissKeyboard() 関数では ViewController の View の endEditing() メソッドを実行しているだけです。引数の true は強制的にでも終了するかどうかです。

これで、最初の動画のように、UITextField 以外の場所をタップした時に、キーボードが閉じるようになります。

OK ボタンをタップした時にもキーボードが閉じられ、TouchUpInside のイベントも実行され Tapped!! とプリントされています。

UIViewController の Extension として実装する

この他の場所をタップした時にキーボードを閉じるコードは、入力項目のある複数の UIViewController で必要になることも多いと思います。

そんな時は、UIViewController の Extension として実装するのもひとつの手です。

UIViewController+DismissKeyboard.swift と言う名前の Swift ファイルを生成して、以下のコードを保存しておきます。

import UIKit

extension UIViewController {
    
    func setDismissKeyboard() {
        let tapGR: UITapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(dismissKeyboard))
        tapGR.cancelsTouchesInView = false
        self.view.addGestureRecognizer(tapGR)
    }
    
    @objc func dismissKeyboard() {
        self.view.endEditing(true)
    }
}

そうすると、キーボードを閉じたい ViewController の viewDidLoad() で setDismissKeyboard() を呼ぶだけでよくなります。

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        setDismissKeyboard()
    }

以上、Swift で画面の他の場所をタップした時にキーボードを閉じる方法についてご説明しました。