I have a scenario where I need to present a paywall in front of an open sheet - so two sheets stacked at two different heights. Ideally the open sheet would be at half height and the paywall would be at one-third height.

I can get it working using the system detents of medium and large, but not with custom detents. The issue I am seeing with custom detents is that when the second sheet is presented, the first sheet resizes to be the same height as the second sheet. I don't want this because then the paywall covers the first sheet, which shows what the user might want to pay for. The problem with using the system detents is that the first sheet covers the entire screen, and it's just a menu with controls that updates the main screen, so it's nice to have the sheet half-height so the user can see what the controls do.

An example based on HackingWithSwift:

struct ContentView: View { @State private var showingFirst = false @State private var showingSecond = false var body: some View { VStack { Button("Show First Sheet") { showingFirst = true } } .presentationDetents([.large()]) .sheet(isPresented: $showingFirst) { Button("Show Second Sheet") { showingSecond = true } .sheet(isPresented: $showingSecond) { Text("Second Sheet") .presentationDetents([.medium()]) } } } }

I may have to use .overlay for the paywall, but I'd rather present it as a sheet to have the built in behavior like swipe to dismiss.

This post didn't address the use of custom detents: SwiftUI Stacked sheets

Jim Margolis's user avatar

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.