【SwiftUI】Sheetでハーフモーダルを利用する(presentationDetents)(iOS16/iPadOS16)

SwiftUI

iOS16/iPadOS16にてSheetに念願のハーフモーダルが追加されました。
iOS15でUIKit側に実装されていたのですがSwiftUIにはありませんでした。
SwiftUIにpresentationDetents modifierが追加され、
これを使用する事でハーフモーダルが簡単に実現可能です。

presentationDetents

presentationDetents modifierということで、
sheet modifierはそのままにsheet内のViewの方に使用します。

struct ContentView: View {
    
    @State var sheet = false
    
    var body: some View {
        Button("Sheet"){
            sheet.toggle()
        }.sheet(isPresented: $sheet) {
            Text("Sheet!!")
                .presentationDetents([.medium])
        }
    }
}

たったこれだけでハーフモーダルが実現します。

PresentationDetentはlargeとmediumがあり、
largeにするといつもの全画面サイズのsheetになります。

引数に使用しているPresentationDetentは見ての通り配列で、
largeとmediumの両方を指定すると可変になります。

また、他にもheight、fractionがあり、高さや割合で指定する事も出来ます。
なお、配列は自動でソートされるようで一番低いものが優先され一番初めに表示されます。

.customもありCustomPresentationDetentプロトコルを実装した構造体を使用する事もできる様です。

※詳細な解説記事を書きました。
高さ指定の例や、selection引数を使って状態を確認・変更する方法についても解説しています。

コメント

タイトルとURLをコピーしました