[SwiftUI]「シート(Sheet)」を表示する方法[Xcode]

表示するには？
まとめ
参考
オススメの記事

表示するには？

コード, プログラミング, ハッキング, Html, ウェブ, データ, デザイン, 発達, プログラム

シートを表示するには、sheetモディファイアを使います。

具体的には、次の手順で表示させます。

Bool型の状態変数を用意
sheetモディファイアをビューに付ける
用意した状態変数をtrueにする

Bool型の状態変数を用意

まず、表示・非表示を切り替えるためのBool型の状態変数を用意します。

@State var showSheet = false

デフォルトでは非表示なのでfalseにしときます。

sheetモディファイアをビューにつける

sheetモディファイアをビューに付けます。

この時、引数として先頭に$を付けた状態変数を設定し、クロージャーにシートとして表示させるビューを指定します。

VStack {
            Button(action: {
                
            }, label: {
                Text("シートを表示")
            })
                
        }
        .sheet(isPresented: $showSheet) {
            Text("シート")
        }

isPresentedに状態変数を渡すことで、trueになった時にシートが表示されるようになります。

用意した状態変数をtrueにする

struct sampleView: View {
    @State var showSheet = false
    var body: some View {
        VStack {
            Button(action: {
                
                //trueにする
                showSheet = true
                
            }, label: {
                Text("シートを表示")
            })
                
        }
        .sheet(isPresented: $showSheet) {
            Text("シート")
        }  
    }
}