search
LoginSignup
3

More than 5 years have passed since last update.

posted at

テキストフィールドのキーボードを引っ込める

みなさん、こんにちは。アプリ道場の蒲池です。

今回はテキストフィールドなどが入力状態になった時に表示される「キーボードを引っ込めるボタン」を追加する方法について、勉強したことを書いてみます。

テキストフィールドに入力する際に表示されるキーボードを引っ込めるタイミングは、

  • 他の画面(テキストフィールドの外)がタップされた時
  • キーボードにある「return」が押された時

などがありますが、Doneボタンを作ってキーボードに乗せて表示させておいて、入力が終わってそのDoneボタンを押したら、キーボードが引っ込む、そういうやり方が安定していて好きなのです。

キードードに初めから備わっていない「Doneボタン」を追加してやって、それを押した時に、引っこませようとするわけです。


ツールバー(ボタンビュー)部分を作成する

色は分かりやすくするためgreenColorにしましたが、実際は、lightGrayColorなどが良いと思います。

// Doneボタンの乗るボタンビュー buttonViewForKeyboard を作成します。

そのビューの位置・サイズは、frame: CGRectMake(0, 0, 320, 40)で設定すれば、乗せるキーボードの端から、この場合は、幅320高さ40です。

ボタンビュー作成
let buttonViewForKeyboard = UIView(frame: CGRectMake(0, 0, 320, 40))
buttonViewForKeyboard.backgroundColor = UIColor.greenColor()

Doneボタンを作成します。

「Done」の位置は、ビューの右側。幅80、高さ30です。

Doneボタンを作成
let myButton = UIButton(frame: CGRectMake((self.view.bounds.size.width
- 80), 5, 80, 30))
myButton.backgroundColor = UIColor.greenColor()
myButton.setTitle("Done", forState: UIControlState.Normal)

Doneボタンが押された時のメソッドを指定する

Doneボタンが押されたらonMyButtonのメソッドを呼び出す
myButton.addTarget(self, action: "onMyButton", forControlEvents:
UIControlEvents.TouchUpInside)

ボタンの乗ったボタンビューをKeyboardのビューに追加 add する

ボタンビューをaddする
buttonViewForKeyboard.addSubview(myButton)

ボタンの乗ったビューたる buttonViewForKeyboard をフィールドに設定

いくつTextFieldを作っても、全部、このようにbuttonViewForKeyboardを設定すれば良いようです。inputAccessoryView のおかげで、どのデバイスでもうまく収まるようです。

ボタンの乗ったビューをフィールドに設定
firstTextField.inputAccessoryView = buttonViewForKeyboard
secondTextField.inputAccessoryView = buttonViewForKeyboard
andSoOnTextField.inputAccessoryView = buttonViewForKeyboard

Doneボタンを押した時呼ばれるメソッド。

その名前が、onMyButton。

つまり、これが、キーボードを引っ込める命令。

キーボードを引っ込める
func onMyButton(){
self.view.endEditing(true)
}

僕のアプリはこの機能が頻繁に発生するので、定番化しています。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
3