Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SwiftUI: Dismiss View Within macOS NavigationView

As detailed here (on an iOS topic), the following code can be used to make a SwiftUI View dismiss itself:

@Environment(\.presentationMode) var presentationMode
// ...
presentationMode.wrappedValue.dismiss()

However, this approach doesn't work for a native (not Catalyst) macOS NavigationView setup (such as the below), where the selected view is displayed alongside the List.

Ideally, when any of these sub-views use the above, the list would go back to having nothing selected (like when it first launched); however, the dismiss function appears to do nothing: the view remains exactly the same.

Is this a bug, or expected macOS behaviour?

Is there another approach that can be used instead?

struct HelpView: View {

    var body: some View {

        NavigationView {
            List {
                NavigationLink(destination:
                    AboutAppView()
                ) {
                    Text("About this App")
                }
                NavigationLink(destination:
                    Text("Here’s a User Guide")
                ) {
                    Text("User Guide")
                }
            }
        }
    }
}

struct AboutAppView: View {

    @Environment(\.presentationMode) var presentationMode

    public var body: some View {
        Button(action: {
            self.dismissSelf()
        }) {
            Text("Dismiss Me!")
        }
    }

    private func dismissSelf() {
        presentationMode.wrappedValue.dismiss()
    }
}

FYI: The real intent is for less direct scenarios (such as triggering from an Alert upon completion of a task); the button setup here is just for simplicity.

like image 887
TheNeil Avatar asked Dec 16 '19 17:12

TheNeil


Video Answer


1 Answers

The solution here is simple. Do not use Navigation View where you need to dismiss the view.

Check the example given by Apple https://developer.apple.com/tutorials/swiftui/creating-a-macos-app

If you need dismissable view, there is 2 way.

  1. Create a new modal window (This is more complicated)
  2. Use sheet.

Following is implimenation fo sheet in macOS with SwiftUI

struct HelpView: View {
    @State private var showModal = false
    var body: some View {
        NavigationView {
            List {
                NavigationLink(destination:
                    VStack {
                        Button("About"){ self.showModal.toggle() }
                        Text("Here’s a User Guide")
                    }
                ) {
                    Text("User Guide")
                }
            }
        }
        .sheet(isPresented: $showModal) {
            AboutAppView(showModal: self.$showModal)
        }
    }
}

struct AboutAppView: View {
    @Binding var showModal: Bool
    public var body: some View {
        Button(action: {
            self.showModal.toggle()
        }) {
            Text("Dismiss Me!")
        }
    }
}

There is also a 3rd option to use ZStack to create a Modal Card in RootView and change opacity to show and hide with dynamic data.

like image 88
NikzJon Avatar answered Nov 10 '22 23:11

NikzJon