Presentation Detents & Bottom Sheet in SwiftUI, iOS 16.4 — Sheet Background

DevTechie
DevTechie
Published in
5 min readJun 18, 2023

--

Presentation Detents & Bottom Sheet in SwiftUI, iOS 16.4 — Sheet Background

We will continue our exploration of presentation detent and look at the configuration options introduced in iOS 16.4 with the release of Xcode 14.3 for bottom sheet and presentation detents.

So far we have built this example:

import MapKit
import SwiftUI

struct ContentView: View {
@State private var showSheet = false

@State private var region = MKCoordinateRegion(center: CLLocationCoordinate2D(latitude: 37.828856106105846, longitude: -122.47844712682773), span: MKCoordinateSpan(latitudeDelta: 0.5, longitudeDelta: 0.5))

var body: some View {
ZStack(alignment: .bottom) {
Map(coordinateRegion: $region)
.edgesIgnoringSafeArea(.all)

Button {
showSheet.toggle()
} label: {
RoundedRectangle(cornerRadius: 15)
.foregroundColor(.white)
.overlay {
RoundedRectangle(cornerRadius: 15)
.stroke(Color.black, lineWidth: 2)
}
.overlay {
Text("Search...")
}
.frame(maxWidth: .infinity)
.frame(height: 50)
.padding()
.padding(.bottom, 20)…

--

--