【Swift UIKit】キーボードを閉じる方法!UITextField

この記事からわかること

  • SwiftUIKitTextFieldなどでキーボード閉じる方法
  • TextFieldのキーボードが表示される仕組み
  • FirstResponderUIResponderとは?
  • UITextFieldDelegatetextFieldShouldReturnメソッドresignFirstResponderの使い方
  • endEditingメソッドの使い方
  • 閉じるボタンキーボード設置するには?

index

[open]

\ アプリをリリースしました /

みんなの誕生日

友達や家族の誕生日をメモ!通知も届く-みんなの誕生日-

posted withアプリーチ

SwiftのUIKitフレームワークにおいてUITextField などでキーボードを閉じる方法をまとめていきます。

キーボードは閉じれない?

Swift UIのTextField構造体を用いた実装とは違いUIKitのUITextFieldクラスを使った入力ボックスの実装ではデフォルトではキーボードを閉じることができませんでした。

Swift UIの場合はreturn(改行)を押すとキーボードを閉じる使用になっていますがUIKitの場合は自力で実装する必要があるようです。

ちなみにSwift UIでもキーボードを数値のみにした場合閉じれなくなってしまう問題が発生するので注意してください。

キーボードが開く仕組み

UIKitのビュークラスではタッチなどのイベントをUIResponderと呼ばれるイベントを処理するインターフェース使って管理されています。

UITextFieldではタッチされるとFirstResponderと呼ばれる1番に処理するイベントを保持するUIResponderオブジェクトとして登録されます。

入力待機状態の時はずっとこのFirstResponderに登録されている状態(キーボードが表示されている状態)なのでこのフォーカスを外すことでキーボードを閉じることが可能になります。

ちなみにFirstResponderは最初に処理するイベントを保持する場所ですが、後続で新しいイベントが次々きた場合はResponderChainと呼ばれる仕組みを使ってイベントを待機させ、順次処理していくようです。

return(改行)でキーボードを閉じる方法

UIKitのUITextFieldでは毎度閉じる方法を明示的に実装する必要があります。(何かしなくても良い方法があるのかな?)

実装の流れ

実装方法は簡単でUITextFieldDelegateプロトコルに準拠させてtextFieldShouldReturnメソッドを定義していきます。これはreturnが押された時に実行されるデリゲードメソッドです。

その中で対象ビューがFirstResponderから削除されるようにUIResponderクラスの持つresignFirstResponderメソッドを使ってFirstResponderから外すことでキーボードを非表示にします。

公式リファレンス:UITextFieldDelegate

class EntryCategoryViewController: UIViewController,UITextFieldDelegate {

    @IBOutlet  var nameTextField: UITextField!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        nameTextField.delegate = self
    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        textField.resignFirstResponder()
        return true
    }
}

UIResponderのendEditingメソッド

FirstResponderから解除する方法としてUI Viewの持つendEditingメソッドでも可能です。引数にtrue渡せばキーボードが閉じるようになります。

 nameTextField.endEditing(true)

とはいえこのメソッドも内部的にビュー階層内のFirstResponderを探索して resignFirstResponderメソッドを実行しているだけのようなのでやっていることは同じです。

閉じるボタンをキーボードに設置する

【Swift UI】TextFieldのキーボードを閉じる方法と@FocusStateの使い方

数字のみのキーボードにした場合はreturnキーがないので閉じることができなくなってしまいます。そのためキーボードのツールバーに上記のような「閉じるボタン」を設置する方法をとります。

ポイント

実装コード

UIToolbarクラスを使用してキーボードの上にボタンを設置します。次にUIBarButtonItemクラスで「スペーサー」と「閉じるボタン」を定義しツールバーに組み込みます。閉じるボタンのアクションとしてcloseButtonTappedメソッドを定義し、endEditingを実行します。

最後に構築したツールバーをinputAccessoryViewプロパティに渡して完了です。

公式リファレンス:inputAccessoryView

override func viewDidLoad() {
      super.viewDidLoad()

      // MARK: - 閉じるボタン
      let toolBar = UIToolbar()
      toolBar.sizeToFit()
      // スペーサー構築
      let spacer = UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.flexibleSpace, target: self, action: nil)
      // 閉じるボタン構築
      let closeButton = UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.done, target: self, action:#selector(closeButtonTapped))

      toolBar.items = [spacer, closeButton]
      textField.inputAccessoryView = toolBar
      // MARK: - 閉じるボタン
    }

    // MARK: - 閉じるボタン
    @objc  func closeButtonTapped() {
        self.view.endEditing(true)
    }

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。

searchbox

スポンサー

ProFile

ame

趣味:読書,プログラミング学習,サイト制作,ブログ

IT嫌いを克服するためにITパスを取得しようと勉強してからサイト制作が趣味に変わりました笑
今はCMSを使わずこのサイトを完全自作でサイト運営中〜

自作iOSアプリ

\ アプリをリリースしました /

mapping

自分だけの地図を作ろう!-mapping-

無料posted withアプリーチ

割り勘アプリ-bill-

旅行におすすめ!
割り勘アプリ-bill-

無料posted withアプリーチ

Imakoko

現在地を取得するアプリ!Imakoko

無料posted withアプリーチ

ふるログ

ふるさと納税管理アプリ-ふるログ-

無料posted withアプリーチ

Remind-シンプル通知アプリ-

シンプル通知アプリ-Remind-

無料posted withアプリーチ

CLIPURL

好きな記事をクリップしよう!-CLIPURL-

無料posted withアプリーチ

記録カレンダー

続けたを可視化できるアプリ!記録カレンダー

無料posted withアプリーチ

CART-共有できるお買い物リスト-

CART-共有できるお買い物リスト-

無料posted withアプリーチ

QuickPressPanel

早押しゲーム-QuickPressPanel-

無料posted withアプリーチ

貸し借り管理アプリ

友達とのお金の管理-貸し借り管理アプリ-

無料posted withアプリーチ

みんなの誕生日

友達や家族の誕生日をメモ!通知も届く-みんなの誕生日-

posted withアプリーチ

Githubにて
iOSアプリのソースコードを公開中!

自作Webアプリ

子育て知識共有サイト-mikata-

子育て知識共有サイト-mikata-

New Article

index