Keeping the glass-style background inside a sheet with presentationDetents when navigating inside the sheet

Question

Created 5d

Replies 1

Boosts 0

Participants 1

Is there a way to keep the glass-style background on iOS 26 for a sheet with .presentationDetents when you navigate into a NavigationStack inside the sheet?

Root level with glass:

After following a NavigationLink inside the stack, the background is always opaque:

The UI I'm building is somewhat similar to the Maps app, which resorts to showing another sheet on top of the main sheet when you select a location on the Map). I'm trying to get a similar look but with a proper navigation hierarchy inside the sheet's stack.

Example code:

import SwiftUI
import MapKit

struct ContentView: View {
    var body: some View {
        Map()
            .sheet(isPresented: .constant(true)) {
                NavigationStack {
                    VStack {
                        Text("Hello")
                        
                        NavigationLink("Show Foo") {
                            Text("Foo")
                                .navigationTitle("Foo")
                                .presentationBackground(Color.clear)
                        }
                        
                    }
                }
                .presentationDetents([.medium, .large])
                .presentationBackgroundInteraction(.enabled)
            }
    }
}

#Preview {
    ContentView()
}

Boost

Answer 1

ralf.ebert OP

5d

Found it, .containerBackground does the trick:

import SwiftUI
import MapKit
 
struct ContentView: View {
    var body: some View {
        Map()
            .sheet(isPresented: .constant(true)) {
                NavigationStack {
                    VStack {
                        Text("Hello")
                        
                        NavigationLink("Show Foo") {
                            Text("Foo")
                                .navigationTitle("Foo")
                                .containerBackground(Color.clear, for: .navigation) /* <--- */
                        }
                        
                    }
                }
                .presentationDetents([.medium, .large])
                .presentationBackgroundInteraction(.enabled)
            }
    }
}

0