Force blurred NavigationBar?

Hi,

Is it possible to control how the navigation bar appears in SwiftUI? When I present a view using NavigationLink, the entire navigation bar becomes transparent and making it hard to differentiate between the items in the navigation bar and the actual content below.

I want the Navigation Bar to be blurred.

Code Block var body: some View {
        VStack {
            
            Map(coordinateRegion: $region, annotationItems: rekoRings.filter({ searchBar.text.isEmpty || $0.name.localizedStandardContains(searchBar.text) })) { ring in
                MapAnnotation(coordinate: CLLocationCoordinate2D(latitude: ring.latitude, longitude: ring.longitude),
                              anchorPoint: CGPoint(x: 0.5, y: 0.5)) {
                    
                    NavigationLink(
                        destination: RekoRingDetailView(rekoRing: ring),
                        label: {
                            VStack {
                                Image(systemName: "smallcircle.fill.circle.fill")
                                    .frame(width: 22, height: 22, alignment: .center)
                                    .foregroundColor(.red)
                                
                                if !disableInteraction {
                                    Text(ring.name)
                                        .font(.caption)
                                        .foregroundColor(.primary)
                                }
                            }
                        })
                }
            }
            .edgesIgnoringSafeArea(.all)
            .disabled(disableInteraction)
        }
        .add(searchBar)
        .onAppear(perform: {
            fetchRings()
        })
        .navigationTitle(Text("Delivery Locations"))
    }


Hi @espen, did you find a solution for this?

cheers

Hello :)

You can try to add .toolbarBackground(.visible, for: .navigationBar) below the navigation title modifier.

Force blurred NavigationBar?
 
 
Q