0

I am trying to have a sheet with 2 buttons to navigate to different views. This works fine with a NavigationView + NavigationLink. It navigates as expected to another view.

However I am dealing with this:

First I as expected see the presentationBackground: The sheet has a ultraThinBackground Style and behaves as expected

However then navigating with a NavigationLink leads to a white background:

The sheet now has a fully white background instead of the prior ultraThinBackground style

I am new to swiftui so I may be missing the obvious here. I tried setting both presentationBackground and background on both the destination paramter of the NavigationLink and the content within the new view. Those all seemed to have no affect.

Example Code:

import Foundation
import SwiftUI

struct PlaceHolderView_Demo: View {
    @Binding fileprivate var currentSheetOpeningLevel: PresentationDetent

    var body: some View {
        VStack(alignment: .leading) {
            Text("Meow")
        }.onAppear {
            currentSheetOpeningLevel = PresentationDetent.large
        }.background(Color.clear, ignoresSafeAreaEdges: .all)
    }
}

struct ContentView: View {
    @State private var currentSheetOpeningLevel = PresentationDetent.medium

    var body: some View {
        NavigationView {
            MapView()
                .edgesIgnoringSafeArea(.all)
                .sheet(isPresented: .constant(true)) {
                    NavigationView {
                        InfoSheetView_Demo(currentSheetOpeningLevel: $currentSheetOpeningLevel)
                    }
                    .navigationViewStyle(.stack)
                    .presentationDetents([.medium, .large], selection: $currentSheetOpeningLevel)
                    .interactiveDismissDisabled(true)
                    .presentationBackgroundInteraction(.enabled)
                    .presentationBackground(.ultraThinMaterial)
                }
        }
        .navigationViewStyle(.stack)
    }
}

struct InfoSheetView_Demo: View {
    @Binding var currentSheetOpeningLevel: PresentationDetent
    @State private var searchText = ""

    var body: some View {
        VStack(alignment: .leading) {
            InfoSheetContent(currentSheetOpeningLevel: $currentSheetOpeningLevel).padding()
            Spacer()
        }
        .searchable(text: $searchText, prompt: Text("Search for your Destination"))
    }

    struct InfoSheetContent: View {
        @Binding fileprivate var currentSheetOpeningLevel: PresentationDetent
        @Environment(\.isSearching) private var isSearching
        @State private var searching: Bool = false

        var body: some View {
            if !searching {
                VStack(alignment: .leading) {
                    HStack(alignment: .top, spacing: 10) {
                        Button(action: {}) {
                            Label("Karte", systemImage: "map")
                                .labelStyle(DefaultLabelStyle())
                                .frame(maxWidth: .infinity)
                        }
                        .buttonStyle(.borderedProminent)
                        .controlSize(.large)

                        NavigationLink(destination: PlaceHolderView_Demo(currentSheetOpeningLevel: $currentSheetOpeningLevel)) {
                            Label("Mitnehmen", systemImage: "figure.wave")
                                .labelStyle(DefaultLabelStyle())
                                .frame(maxWidth: .infinity)
                        }
                        .buttonStyle(.bordered)
                        .controlSize(.large)
                    }
                    .padding()
                }
                .background(.thinMaterial)
                .frame(maxWidth: .infinity, maxHeight: 120)
                .cornerRadius(15)
            }
        }
    }
}

struct ContentView_Demo_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
MTRNord
  • 133
  • 2
  • 14
  • This needs a [Minimal Reproducible Example (MRE)](https://stackoverflow.com/help/minimal-reproducible-example). – Yrb Aug 20 '23 at 13:57
  • This is because a sheet uses the `Content` of the views , and has a `ultraLightMaterial` for it's background if the `Content` does not extend and take up the entire view. For example, if you add a `ZStack` to your `Karte` view, then it will have a full-white background. On the other hand, a Navigation Stack uses a `background` which is defined by the OS as the `Content` already has a full-white background. – xTwisteDx Aug 20 '23 at 13:57
  • I will add an example in a few minutes :) Just got home again. – MTRNord Aug 20 '23 at 17:23

0 Answers0