ググっても(初学者にわかりやすい記事が)なかなか出てこなかったので自分で記事にしときます。
メールアドレスとパスワードを入力しないと「登録ボタン」が押せない(アドレスとパスワードが入力されていればボタンが押せる)ようにしたい場合のやり方を紹介します。
よくあるこういうやつ↑です。今回想定するのは超シンプル(簡素)なものです。
目次
結論：バリデーションを使うと良い
バリデーション(検証)を使いましょう。
バリデーションとは、Swiftの特別な機能という訳ではなく、「何かの処理に制限を設けるといった概念」のようなものと捉えてください。
今回の例では、「2つのTextFieldの中身が空あるいはnilか」を検証しています。
fa-chevron-circle-rightコードの全体像
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
import UIKit class ViewController: UIViewController { @IBOutlet weak var tourokuButton: UIButton! private var mailText: String? private var passwordText: String? override func viewDidLoad() { super.viewDidLoad() } @IBAction func mailEditChanged(_ sender: UITextField) { self.mailText = sender.text self.validate() } @IBAction func passwordEditChanged(_ sender: UITextField) { self.passwordText = sender.text self.validate() } private func validate() { // nilの場合はtourokuButtonを非活性に guard let mailTxt = self.mailText, let passTxt = self.passwordText else { self.tourokuButton.isEnabled = false return } // 文字数が0の場合(""空文字)もtourokuButtonを非活性に if mailTxt.count == 0 || passTxt.count == 0 { self.tourokuButton.isEnabled = false return } // nilでないかつ0文字以上はtourokuButtonを活性に self.tourokuButton.isEnabled = true } } |
fa-chevron-circle-right2つのTextFieldをつなぐ
画像のように部品を配置したら、2つのTextFieldをCtrlドラックでviewController.Swiftにつなぎます。
このとき、ダイヤログ画面では次の画像の通りにしてください。(パスワードの方も同様)
バリデーションの使い方(作り方・書き方)
バリデーションは「func validate()」のように自分でメソッドを作って実装します。
fa-chevron-circle-rightvalidateメソッド部分
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
private func validate() { // nilの場合はtourokuButtonを非活性に guard let mailTxt = self.mailText, let passTxt = self.passwordText else { self.tourokuButton.isEnabled = false return } // 文字数が0の場合(""空文字)tourokuButtonを非活性に if mailTxt.count == 0 || passTxt.count == 0 { self.tourokuButton.isEnabled = false return } // nilでないかつ0文字以上はtourokuButtonを活性に self.tourokuButton.isEnabled = true } |
fa-chevron-circle-rightguard let文でアンラップ
右辺の変数mailTextとpasswordTextに値が入っている場合は、その値が左辺の変数mailTxtとpassTxtに値が入ります。
変数mailTxtとpassTxtに値が入らなかった(変数mailTextとpasswordTextに値が入っていなかった)場合はelse{}内が実行され、ボタンが押せなく(非活性)なります。
guard let文について詳しく
fa-chevron-circle-right文字数の有無でボタンを非活性にする
変数mailTxtとpassTxtに値が入ったら、処理がif文まで降りてきます。
mailTxt.countまたはpassTxt.countが「0」だった場合は、「.isEnabled = false」でボタンが押せなくなります。
そうでない(mailTxt.countとpassTxt.countがともに値を持っている)場合のみ、「.isEnabled = true」でボタンが押せるようになります。
validate()を@IBAction内で呼ぶ
今作ったvalidate()メソッドを、@IBAction内で呼び出します。
fa-chevron-circle-right@IBAction部分
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
@IBAction func mailEditChanged(_ sender: UITextField) { self.mailText = sender.text self.validate() } @IBAction func passwordEditChanged(_ sender: UITextField) { self.passwordText = sender.text self.validate() } |
「sender」は「IBActionに紐付けされたTextField」のことです。
ユーザーが入力した文字列(sender.text)を変数mailTextとpasswordTextに代入しています。
初期状態もボタンを押せなくする
UIButtonが選択された状態でinspectorを開けて、「State」の「Enable」のチェックを外してください。そうすると画面が開いた瞬間からボタンが押せなくなっています。
参考に作ってみてください
新規プロジェクト作って真似してみると分かりやすいかもしれません！お試しあれ！
