![見出し画像](https://assets.st-note.com/production/uploads/images/100940311/rectangle_large_type_2_5e2e3075fabc4503c13190c3864e9f4a.png?width=800)
【徒然iOS】気ままにUIKit64〜Tap Gesture Recognizer キーボード以外の場所をタップしてキーボードを閉じる〜
概要
このマガジンは四十を過ぎたおっさんが、
を参考にStoryboardでiOSアプリを完全に趣味で楽しんでいるだけな記事を気ままに上げてます。
今回
をハイ、レッツゴ🕺
前準備
念の為、
バックアップ
新しいクラス
ビューコントローラの追加
イニシャルビューの変更
をいつも通りやってから本題へ💃
![](https://assets.st-note.com/img/1679529137166-CyOVqewxCN.png?width=800)
本題
⒈ラベルとテキストフィールドを配置して、アウトレット接続
![](https://assets.st-note.com/img/1679529311142-sYZPNSAcT6.png?width=800)
![](https://assets.st-note.com/img/1679529324021-ySHlo9Gsxj.png?width=800)
![](https://assets.st-note.com/img/1679529335206-6biKU0V8cn.png?width=800)
![](https://assets.st-note.com/img/1679529346555-ud461vEBCC.png?width=800)
![](https://assets.st-note.com/img/1679529409648-O0sgNBqIh7.png?width=800)
![](https://assets.st-note.com/img/1679529424664-ff2BgTbE26.png?width=800)
![](https://assets.st-note.com/img/1679529438891-GOkYNLpOFQ.png?width=800)
⒉タップリコグナイザーを配置して、アウトレットとアクション接続
![](https://assets.st-note.com/img/1679529591986-G8aWizqkU6.png?width=800)
![](https://assets.st-note.com/img/1679529610637-mv52aERfgL.png?width=800)
![](https://assets.st-note.com/img/1679529725792-99R5mS5Ior.png?width=800)
![](https://assets.st-note.com/img/1679529739708-UqlgEHy1SN.png?width=800)
![](https://assets.st-note.com/img/1679529807734-Q8Juwbbkeb.png?width=800)
![](https://assets.st-note.com/img/1679529828619-IhWyRVjeSu.png?width=800)
⒊ダブルタップ用のタップリコグナイザーを配置して、アウトレット接続
![](https://assets.st-note.com/img/1679530015552-vEvDsvofs0.png?width=800)
![](https://assets.st-note.com/img/1679530029677-OIPC2N5j9Z.png?width=800)
![](https://assets.st-note.com/img/1679530044738-xNUQbgNvi5.png?width=800)
⒋2個目のTapGestureの設定を2に〜〜〜
![](https://assets.st-note.com/img/1679530124974-DUSOIbbR2F.png)
⒌コード組み込み
//
// ViewController.swift
//
import UIKit
class ViewController: UIViewController, UITextFieldDelegate {
@IBOutlet weak var testLabel: UILabel!
@IBOutlet weak var testTextField: UITextField!
@IBOutlet var doubleRecognizer: UITapGestureRecognizer!
@IBOutlet var singleRecognizer: UITapGestureRecognizer!
//最初からあるメソッド
override func viewDidLoad() {
super.viewDidLoad()
//デリゲート先を自分に設定する。
testTextField.delegate = self
//ダブルタップに失敗したときのみシングルタップの検知を有効にする。
singleRecognizer.requireGestureRecognizerToFail(doubleRecognizer)
}
//シングルタップ時の呼び出しメソッド
@IBAction func tapView(sender: UITapGestureRecognizer) {
//テキストフィールドの文字列をラベルに設定する。
testLabel.text = testTextField.text
//キーボードを閉じる。
view.endEditing(true)
}
//Returnキー押下時の呼び出しメソッド
func textFieldShouldReturn(textField: UITextField) -> Bool {
//テキストフィールドの文字列をラベルに設定する。
testLabel.text = testTextField.text
//キーボードを閉じる。
view.endEditing(true)
return true
}
}
を参考に👀
今回のコード(まとめ)
class TapRecognizerViewController: UIViewController, UITextFieldDelegate {
@IBOutlet weak var myLabel: UILabel!
@IBOutlet weak var myTextField: UITextField!
@IBOutlet var singleTap: UITapGestureRecognizer!
@IBOutlet var doubleTap: UITapGestureRecognizer!
//最初からあるメソッド
override func viewDidLoad() {
super.viewDidLoad()
//デリゲート先を自分に設定する。
myTextField.delegate = self
//ダブルタップに失敗したときのみシングルタップの検知を有効にする。
singleTap.require(toFail: doubleTap)
}
//シングルタップ時の呼び出しメソッド
@IBAction func myTapView(_ sender: UITapGestureRecognizer) {
//テキストフィールドの文字列をラベルに設定する。
myLabel.text = myTextField.text
//キーボードを閉じる。
view.endEditing(true)
}
//Returnキー押下時の呼び出しメソッド
func textFieldShouldReturn(_ textField: UITextField) -> Bool {
//テキストフィールドの文字列をラベルに設定する。
myLabel.text = myTextField.text
//キーボードを閉じる。
view.endEditing(true)
return true
}
}
⒍シミュレータで実行
![](https://assets.st-note.com/img/1679530648136-xslhUwx5pe.png?width=800)
![](https://assets.st-note.com/img/1679530671187-0YiTz0HimA.png?width=800)
実機でも一応確認したけど、確かにダブルタップでは反応しないね👀
てか、
今回のポイント
そんなにダブルタップでしかキーボードを閉じられないなんて、、、
ユーザーさんが戸惑わせないようにするのに、
アラートなんかで説明が別途必要な仕様なんていらない
👉シングルタップでも閉じる仕様で個人的には十分🕺
*設定項目
Tapsは検知対象とする連打回数。
Touchesは同時に触れている指の数。
サイト記事は以上🕺
ブラッシュアップ
今回は、AutoLayoutのみ
![](https://assets.st-note.com/img/1679531049922-N6xeuFFxvY.png?width=800)
confirmをクリック〜〜〜〜
![](https://assets.st-note.com/img/1679531042161-R7CCqznB4D.png?width=800)
Apple公式
さて次回は、
をレッツゴする🕺
この記事が気に入ったらサポートをしてみませんか?