SOLVED: Bottom Sheet Resizing Bug

@BHasFiveSharps

Oct '23

I'm building an app that makes use of a resizable 'bottom sheet' using .sheet and .presentationDetents, and I'm having an issue where the sheet will under certain circumstances suddenly revert to a normal, non-resizable sheet. In the app I'm working on, this is rare, but there are a few sequences of actions that consistently cause this to happen.

Here's the simplest example I can find that reproduces essentially the same issue:

struct SheetTestView: View {

    @State private var showingSheet = true
    @State private var selectedOption = "Apple"

    let options = ["Apple", "Banana", "Orange", "Pear"]

    var body: some View {
        Button("Show Sheet") { showingSheet = true }
        .sheet(isPresented: $showingSheet) {
            List {
                Picker("Choose a fruit", selection: $selectedOption) {
                    ForEach(options, id: \.self) { option in
                        Text(option)
                    }
                }
            }
//            .presentationCompactAdaptation(.none)
            .presentationDetents([.medium, .large])
        }
    }
}

Here, (using Xcode 15.0) the sheet initially appears as a non-resizable sheet, but as soon as I change the selection of the picker it jumps to the half-height sheet I would have expected.

I think the problem may have something to do with the .presentationCompactAdaptation modifier, but adding this as shown commented above doesn't have any effect. Other actions that I've found to cause this behaviour in certain scenarios have included initiating swipe actions and revealing text fields. The issues I've encountered have all included lists or forms within sheets.

I'd be hugely grateful if anyone has any thoughts on how to get around this issue! Otherwise I think I'll have to resort to making a custom sheet modifier again...

@NigelGee HWS+

Oct '23

After some tinkering, Put the List/Form in a NavigationStack

struct ContentView: View {
    @State private var showingSheet = false
    @State private var selectedOption = "Apple"

    let options = ["Apple", "Banana", "Orange", "Pear"]

    var body: some View {
        Button("Show Sheet") { showingSheet = true }
        .sheet(isPresented: $showingSheet) {
            NavigationStack {
                List {
                    Picker("Choose a fruit", selection: $selectedOption) {
                        ForEach(options, id: \.self) { option in
                            Text(option)
                        }
                    }
                }
            }
            .presentationDetents([.medium, .large])
        }
    }
}

@BHasFiveSharps

Oct '23

Wow yes that solves it– thank you so so much for the reply! I still think this is a bug in SwiftUI but this works perfectly as a workaround for me.

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.