Show half-sheet in SwiftUI
In iOS 16 we can finally present a resizable sheet in SwiftUI. To specify which detents the sheet supports, we can use the new presentationDetents() modifier.
To present a half-sheet that can't be resized by the user, we specify a single medium detent.
struct ContentView: View {
@State private var showSheet = false
var body: some View {
Button("Show Sheet") {
showSheet = true
}
.sheet(isPresented: $showSheet) {
Text("Sheet Content")
.presentationDetents([.medium])
}
}
}
To present a sheet that can be resized between a half-sheet and a full sheet, we should add both medium
and large
detents.
struct ContentView: View {
@State private var showSheet = false
var body: some View {
Button("Show Sheet") {
showSheet = true
}
.sheet(isPresented: $showSheet) {
Text("Sheet Content")
.presentationDetents([.medium, .large])
}
}
}
Detents are only supported for sheets presented on iPhone or in compact horizontal size on iPad. In regular size on iPad and on the Mac, detents will be ignored.
SwiftUI also added support for some custom detents, you can find out more in PresentationDetent documentation.
If you would like to learn more about resizable sheets in SwiftUI, you can read our detailed post that covers all the functionality and limitations of the API.
Check out our new book!
Swift Gems
100+ tips to take your Swift code to the next level
Swift Gems
100+ tips to take your Swift code to the next level
- Advanced Swift techniques for experienced developers bypassing basic tutorials
- Curated, actionable tips ready for immediate integration into any Swift project
- Strategies to improve code quality, structure, and performance across all platforms
- Practical Swift insights from years of development, applicable from iOS to server-side Swift