SwiftUIではsheetモディファイアを使うことで、ビューのモーダル表示を簡単に実装することができる。

基本的な使い方

sheetモディファイアはisPresented引数に、モーダル表示されているかどうかを表す状態変数を渡す必要があるため、まずはBool型の状態変数を用意する。

struct ContentView: View {
    @State var showingDetail = false

    var body: some View {
        
    }
}

また、あらかじめモーダル用のビュー（ModalView.swift）を別途用意しておく。

struct ModalView: View {
    var body: some View {
        Text("下にスワイプして閉じる").font(.system(size: 30))
    }
}

ここまで用意できたら、簡単な例としてモーダル表示切り替え用のボタンを実装していく。

struct ContentView: View {
    @State var showingDetail = false

    var body: some View {
        Button(action: { self.showingDetail.toggle() }) {
            Text("モーダルを表示する")
        }.sheet(isPresented: $showingDetail) {
            ModalView()
        }
    }
}

ボタンをタップするとshowingDetail状態変数の値が切り替わり、trueになるとModalViewが表示される。

なお、表示されたモーダルは下にスワイプすることで閉じることができる。

モーダルを閉じた時に処理をおこなう

sheetモディファイアのonDismiss引数では、モーダルを閉じた時におこなう処理を記述することができる。

onDismissを使って先ほどの基本例を改変した例がこちら。

struct ContentView: View {
    @State var showingDetail = false
    @State var message = ""
    
    var body: some View {
        VStack {
            Button(action: { self.showingDetail.toggle() }) {
                Text("モーダルを表示する")
            }.sheet(isPresented: $showingDetail,
                    onDismiss: {
                        self.message = "モーダル画面を閉じました"
            }) {
                ModalView()
            }
            Text(message)
        }
    }
}

表示したモーダルを下にスワイプして閉じた後、onDismissで指定した処理が実行され、message状態変数に値が代入され画面の更新がおこなわれる。