アラートの基本的な使い方を紹介【.alert】

iOS：15.0以上
XCode（当サイトの環境）：15.0.1

ユーザーに了承を促したり、YES・NOを選択させる場合にアラート画面を表示させたい場合は、alertモディファイアを使用するのが簡単でおすすめです。

パラメータ
サンプルコード
まとめ

パラメータ

title：アラートのタイトルとして使用されるテキスト文字列
isPresented：アラートを表示するかどうかを決定するブール値へのバインディング
actions：アラートのアクションを返す
data：独自で定義したstructなどデータを渡すことができる

サンプルコード

最もシンプルなアラート

以下は最もシンプルにアラートを表示できるコードです。
actionに何も記述していませんが自動的にOKボタンが付いています。

import SwiftUI

struct AlertSmp: View {
    @State private var showAlert = false
    
    var body: some View {
        Button("Show Alert") {
            showAlert = true
        }
        .alert(
            "Title",
            isPresented: $showAlert
        ){
            // actionを記述
        }
    }
}

OKボタン→Yes、Noボタンにカスタマイズする

先ほどデフォルトで表示されていたOKボタンをカスタマイズしてみます。
YES,NOの2つのボタンを用意し、押されたボタンからデータを取得して表示させるサンプルです

import SwiftUI

struct AlertSmp: View {
    @State private var showAlert = false
    @State private var alertMsg = ""
    
    var body: some View {
        Button("Show Alert") {
            showAlert = true
        }
        .alert(
            "Title",
            isPresented: $showAlert
        ){
            // actionを記述
            //アラートに表示するボタン
            Button("YES") {
                alertMsg = "YESボタンをタップしました"
            }
            Button("NO") {
                alertMsg = "NOボタンをタップしました"
            }
        }
        
        Text("\(alertMsg)")
    }
}

独自で定義済みのデータを使用する

structなど独自で定義済みのデータをデータソースにして、渡すことも可能です。

AlertDetailsとしてstructを定義してpresentingに渡すことで使用可能です。
Deleteボタンの下に、Show Alertボタンをタップ時にあらかじめ格納しておいたボタン名称を表示させています。

同様にDetailButtonをタップすると格納されている”Detail Contents”が表示されます。

import SwiftUI

struct AlertSmp: View {
    @State private var showAlert = false
    @State private var alertMsg = ""
    @State private var details: AlertDetails?
    
    var body: some View {
        Button("Show Alert") {
            showAlert = true
            // ※detailsがnilだとアラートボタンがデフォルトに戻ってしまう
            details = AlertDetails(name: "DetailButton", detail: "Detail Contents")
        }
        
        .alert(
            "Title",
            isPresented: $showAlert,
            presenting: details
        ) { details in
            
            Button("Delete", role: .destructive) {
                // 削除ボタンの動作を定義する
                alertMsg = ""
            }
            Button("\(details.name)") {
                // 動的にボタン名称を取得する
                alertMsg = details.detail
            }
        }
        
        Text("\(alertMsg)")
    }
}

struct AlertDetails: Identifiable {
    let id = UUID()
    let name: String
    let detail: String
}