【Swift5/Xcode】TextFieldに値が入っていないときにボタンを非活性（無効）にする方法

実行環境

【Xcode】Version 11.3

【Swift】Version 5.1.3

実現したいこと

• TextFieldに何も入力してないときは、ボタンが押せない（非活性）こと。
• TextFieldに入力したときは、ボタンを押せること。

使える場面

• アカウント情報画面などで、必須項目を必ず入力してもらいたとき。
• パスワード生成画面で、パスワードポリシーをクリアしているとき。

などなど。

方法

先に全てのコードを載せます。

以下で詳しく解説します。

※コピペだけじゃうまく動作しません。ちゃんとstoryboardと紐付けしてください。

import UIKit

class ViewController: UIViewController {
    
    @IBOutlet weak var TextField: UITextField!
    @IBOutlet weak var Btn: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        Btn.isEnabled = false
    }
    
    @IBAction func TextFieldActionBtnInactive(_ sender: Any) {
        if TextField.text == "" {
            Btn.isEnabled = false
        } else {
            Btn.isEnabled = true
        }
    }
}

ソースコード解説

とても簡単なコードなので解説するほどじゃないですが、念の為さらっと解説しておきます。

UI部品を設置（ボタン、テキストフィールドの宣言）

@IBOutlet weak var TextField: UITextField!
@IBOutlet weak var Btn: UIButton!

@IBOutlet〜〜というのは、storyboardの部品をcontrolキーを押しながらコードにドラッグ&ドロップしたときに生成されます。

コードの左側に、このマーク『◉』が付いていたら紐づけられている証拠です。

最初からボタンを非活性（無効）にする処理

override func viewDidLoad() { 
	super.viewDidLoad() 
	Btn.isEnabled = false 
}

ViewDidLoad()は画面遷移後最初に呼ばれるメソッドです。

今回の仕様は、テキストに文字を打ち込んだらボタンを有効にするという仕様なので、最初はボタンを無効にしなければなりません。

Btn.isEnabled = falseで先ほどボタンとして宣言したBtnのボタンが一時的に無効になります。

テキストに打ち込んだらボタンを有効にする処理

@IBAction func TextFieldActionBtnInactive(_ sender: Any) {
	if TextField.text == "" {
		Btn.isEnabled = false 
	} else {
		Btn.isEnabled = true 
	}
}

この紐付け方が重要です。

まずは、storyboardのTextFieldからコードにcontrolを押しながら紐付けましょう。

このようにTypeの二個目の項目をEditing Changedにしましょう。

これは、イベントが発生するタイミングを選んでいます。

今回は、Editing Changed です。直訳すると『編集変更』という意味ですが、このイベントのタイミングは、キーボードで1文字入力した時に行われます。

紐付けした関数の中に、if文で、もしテキストフィールドが何も記入していない状態だったら、ボタンを無効にし、それ以外（記入している）ならば、ボタンを有効にする処理を書いています。

まとめ

現在Swift勉強中なので、このような簡単な処理を備忘録として記事に残しています。

こうした方が早いよとかあったら教えてください。

あなたにおすすめの記事

【Swift5/Xcode】プログラミングできない俺が、iOSアプリ開発してみた。 【2021年版】Swift5/Xcode/OSアプリ開発のオススメ参考書・本・書籍まとめ。初心者から上級者まで！

iOSエンジニア必見

【17選】MacBook Pro/Air周辺機器のオススメのまとめ。〜作業を効率的かつおしゃれに〜