SwiftUI go back programmatically from representable to View

Question

I'm trying to setup a qr reader within a new swift ui app.

I can get load the UIKit qr reader view with this line

NavigationLink(destination: QRCodeScan()){Text("Scan QR")}

This is my ViewControllerRepresentable

struct QRCodeScan: UIViewControllerRepresentable {

func makeCoordinator() -> Coordinator {
    Coordinator(self)
}

func makeUIViewController(context: Context) -> ScannerViewController {
    let vc = ScannerViewController()
    vc.delegate = context.coordinator
    return vc
}

func updateUIViewController(_ vc: ScannerViewController, context: Context) {
}

class Coordinator: NSObject, QRCodeScannerDelegate {
    func codeDidFind(_ code: String) {
        print(code)
        //Go back to the last page, take 'code' with you
    }

    var parent: QRCodeScan

    init(_ parent: QRCodeScan) {
        self.parent = parent
    }
}

}

At the line 'Go back to the last page...' I need to programmatically return to the page which sent the user to the qr scanner. The page loads with a navigation back button, I pretty much need to replicate this buttons behaviour to call when I need

Any help/pointers appreciated

tia

Sorin Lica · Answer 1 · 2019-10-17T09:31:51.543

3

struct ContentView: View {
    @State var isActive = false
    @State var code = ""
    var body: some View {
        NavigationView {
            ZStack {
                NavigationLink(destination: DetailView(isActive: $isActive, code: $code), isActive: $isActive, label: { EmptyView() })
                Button(action: {
                    self.isActive.toggle()
                }, label: {
                    Text("navigate")
                })
            }
        }
    }
}
struct DetailView: View {

    @Binding var isActive: Bool
    @Binding var code: String

    var body: some View {
        Button(action: {
            self.code = "new code"
            self.isActive.toggle()
        }) {
            Text("Back")
        }
    }
}

This might help you, use isActive parameter of NavigationLink to navigate back and forth

edited Oct 17 '19 at 09:31

answered Oct 16 '19 at 18:42

Sorin Lica

6,894
10
35
68

I believe this approach above is preferred way of doing it. Existing SwiftUI API commonly works by taking a binding to isVisible (eg. Alerts) and dismisses it by setting it to false on dismiss. Maniplulation through *presentation* on the other hand seems common now, but to me it feels like it deviates from SwiftUI's declarative style. – svena Oct 17 '19 at 06:36
Yes, the way I’m reading this answer however doesn’t actually solve my problem, it still adds a button to screen 2 that the user has to press to go back, that wasn’t what I was looking for, I already had a button for that, I needed a way to invoke this action in an event handler – robbo5899 Oct 17 '19 at 09:07
@robbo5899 at the line "//Go back to the last page, take 'code' with you" add `self.code = "new code" self.isActive.toggle()`, I just used a button to show you how it works – Sorin Lica Oct 17 '19 at 09:32
Ah ok thanks, seems to be a little more awkward doing it with the Representable and getting the data out of the coordinator, great help thanks – robbo5899 Oct 17 '19 at 14:24

Procrastin8 · Accepted Answer · 2019-10-16T18:46:46.190

The short answer is you can't do that right now. There is neither a binding nor an environment value to set that can trigger this. My guess is there will be some kind of environment value akin to presentationMode that you can tap into but it isn't currently advertised.

You could try the current presentationMode but my real suggestion is to present your QR scanner as a sheet rather than a push. This may actually make more sense from a navigational standpoint anyway. To do it this way, in your presenter set up a @State var to handle when it's presented.

@State var presentQRScanner = false

var body: some View {
    Button("Scan") {
        self.presentQRScanner = true
    }
    .sheet(isPresented: $presentQRScanner) { QRCodeScan() }
}

Then, when you want to programmatically dismiss, your UIViewControllerRepresentable:

@Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>

func scannedCode() {
    presentationMode.wrappedValue.dismiss()
}

Alternatively, you can drive this from the presenter too by creating a closure on the QRCodeScan that gets invoked with the code and you have your presenter dismiss.

var onCodeScanned: (Code) -> Void = { _ in }

func scannedCode() {
    onCodeScanned(code)
}

and in the presenter:

var body: some View {
    Button("Scan") {
        self.presentQRScanner = true
    }
    .sheet(isPresented: $presentQRScanner) { 
        QRCodeScan(onCodeScanned: { 
            self.process($0)
            self.presentQRScanner = false
        })
    }
}

EDIT: was not aware of the isActive binding, that should actually work for you if you still want to push your view on the nav stack instead of present it.

Thanks, went with your advice and changed how the view is presented, now need to get the 'code' back from the modal view. — robbo5899, Oct 16 '19 at 19:08

score 0 · Answer 3 · answered Nov 04 '21 at 23:03

You can do it with the following overload of the NavigationLink. It's available since iOS 13 and later.

Here's the code.

Pay attention to passing $isShowingView binding to the both NavigationLink object and to the ChildView that you want to go out on button tap.

struct ContentView: View {
    
    @State var isShowingChildView = false
    
    var body: some View {
        NavigationView {
            NavigationLink(isActive: $isShowingChildView) {
                ChildView(isShowingView: $isShowingChildView)
            } label: {
                Text("Open new view")
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

struct ChildView: View {
        
    @Binding
    var isShowingView: Bool
    
    var body: some View {
        VStack {
            Button("Back to parent view") {
                isShowingView = false
            }
        }
    }
}

SwiftUI go back programmatically from representable to View

3 Answers3

Linked