SwiftUIでモーダル表示する方法【SwiftUI入門】

今回は単純なモーダル画面の表示方法についてのサンプルを紹介します。

SwiftUIでモーダル表示する方法

View プロトコルには sheet メソッドが用意されており、それを使って Modal View を表示することが出来ます。Button 等の View プロトコルを継承しているものは当然使用することが出来ます。

.sheet(isPresented: Binding<Bool>, content: () -> View)

isPresented: Binding<Bool> には Bool 値の状態変数(@State)を指定します。

content: () -> View にはモーダルとして表示する View を返すクロージャメソッドを指定します。

冒頭サンプルの全体コードは以下です。

struct ContentView: View {
    
    @State private var showingModal = false
    
    var body: some View {
        Button(action: {
            self.showingModal.toggle()
        }) {
            Text("Show Modal.")
        }.sheet(isPresented: $showingModal) {
            ModalView()
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

struct ModalView: View {
    var body: some View {
        Text("Modal View.")
    }
}

struct ModalView_Previews: PreviewProvider {
    static var previews: some View {
        ModalView()
    }
}

以上