SwiftでiOSアプリにカスタムダイアログを作成する方法をわかりやすく解説

Swiftでダイアログボックスを作成する基本

iOSアプリでユーザーへの通知や確認を表示したいとき、活躍するのがUIKitの重要なコンポーネントであるUIAlertControllerです。本記事では、実際のiOSアプリとサンプルプロジェクトを使いながら、カスタムダイアログの作成方法をステップごとに解説します。

まずは空のプロジェクトを作成し、デフォルトのビューコントローラ内で以下の操作を行っていきましょう。

1. UIAlertControllerオブジェクトを作成する

最初に、タイトル・メッセージ・スタイルを指定してアラートのインスタンスを生成します。

let alert = UIAlertController.init(title: title, message: description, preferredStyle: .alert)

preferredStyleには.alertのほかに.actionSheetも指定でき、用途に応じて表示形式を選択できます。

2. アクションを作成する

次に、ダイアログ上に表示するボタン（アクション）を定義します。ここでは「Ok」ボタンを作成し、タップされたときの処理をクロージャ内に記述します。

let okAction = UIAlertAction.init(title: "Ok", style: .default) { _ in
    print("You tapped ok")
    // ここにカスタム処理を記述
}

スタイルには.default以外にも、キャンセル操作用の.cancelや、破壊的な操作を表す赤文字の.destructiveなどがあります。

3. アラートにアクションを追加して表示する

作成したアクションをアラートに登録し、画面に表示します。

alert.addAction(okAction)
self.present(alert, animated: true, completion: nil)

関数化して再利用しやすくする

毎回同じコードを書くのは非効率なので、上記の処理をひとつの関数にまとめましょう。タイトルと説明文を引数として渡せるようにすると、さまざまな場面で使い回せます。

func createAlert(withTitle title: String, andDescription description: String) {
    let alert = UIAlertController.init(title: title, message: description, preferredStyle: .alert)
    let okAction = UIAlertAction.init(title: "Ok", style: .default) {
        _ in print("You tapped ok")
        // ここにカスタム処理を記述
    }
    alert.addAction(okAction)
    self.present(alert, animated: true, completion: nil)
}

実際に呼び出して動作を確認する

次に、viewWillLayoutSubviewsメソッド内でこの関数を呼び出します。

override func viewWillLayoutSubviews() {
    self.createAlert(withTitle: "This is an alert", andDescription: "Enter your description here.")
}

実機やシミュレータでアプリを実行すると、以下のようなダイアログが表示されます。

まとめ

UIAlertControllerを使えば、数行のコードでiOSアプリに標準的なダイアログを実装できます。関数として切り出しておけば再利用性が高まり、複数の画面でも簡単に呼び出せるようになります。さらに、UIAlertActionを複数追加すれば「はい／いいえ」のような選択肢を持つダイアログにも拡張できるので、ぜひ試してみてください。