(SwiftUI) How to present a View in front of navigationBar?

Viewed 147

First View: when click on "Hello, World!1" , I set a NavigationLink that will direct to Second View.

Second View: when click on "Hello, World!2", my PopUpView will appear. But it is going under the navigationBar area. I need the PopUpView to be in front of navigationBar and this view has to be transparent so that we are able to see Second View.

Does anyone know how to solve this problem? Please share your solution with me. Thank you SO much!

My code and screenshots are shown below for your reference.

enter image description here

enter image description here

enter image description here

struct MainView: View {
    var body: some View {
        NavigationView {
            ZStack {
                Color.yellow.ignoresSafeArea(.all)
                
                VStack {
                    NavigationLink(
                        destination: SecondView(),
                        label: {
                            Text("Hello, World!1")
                        })
                }
                .navigationTitle("First")
                .navigationBarTitleDisplayMode(.inline)
            }
        }
    }
}
struct SecondView: View {
    @State var showPop = false
    
    var body: some View {
        ZStack {
            Color.blue.ignoresSafeArea(.all)
            
            VStack {
                Text("Hello, World!2")
                    .onTapGesture {
                        showPop = true
                    }
            }
            
            if showPop {
                PopUpView(showPop: $showPop)
            }
        }
        .navigationTitle("Second")
        .navigationBarTitleDisplayMode(.inline)
    }
}
struct PopUpView: View {
    @Binding var showPop : Bool
    
    var body: some View {
        ZStack {
            Color.black.opacity(0.5).ignoresSafeArea(.all)
                .onTapGesture {
                    showPop.toggle()
                }
            Text("Hello, Pop UP!")
        }
    }
}
0 Answers
Related