WWDC22 SALE: Save 50% on all my Swift books and bundles! >>

SOLVED: Pop multiple nested views using NavigationLink and isActive

Forums > SwiftUI

Hi, I am trying to pop multiple screens back using the isActive property of NavigationLink.

Here is an example:

struct ViewA {
    @State private var showNestedView = false

    var body: some View {
        VStack {
            Text("ViewA")
            Button(action: { showNestedView = true }) {
                Text("Open ViewB")
            }

            NavigationLink(destination: VStack {
                Text("ViewB")
                NavigationLink("Open ViewC", destination: VStack {
                    Text("ViewC")
                    Button(action: { showNestedView = false}) {
                        Text("Go back to ViewA")
                    }
                })
            }, isActive: $showNestedView) {
                EmptyView()
            }
    }
}

The gist of it is that: ViewA opens ViewB using a NavigationLink and isActive: $showNestedView. ViewB then opens ViewC. ViewC has a button that changes the value of showNestedView to false. I expect that this will close both ViewC and ViewB and ViewA will apear on the screen again. Instread ViewC gets clicked the state of showNestedView changes and nothing else happens.

   

TLDR:
I had to set NavigationLink(...).isDetailLink(false) in order to be able to pop multiple views.

Long Answer:
I did play around with this example here: https://www.reddit.com/r/SwiftUI/comments/o86wqu/comment/h33juip/?utm_source=share&utm_medium=web2x&context=3

At some point I ended up having a set of NavigationLinks where the third view that was pushed into the stack was immediately poped after rendering. Then I ended up on this thread: https://developer.apple.com/forums/thread/677333?login=true&page=4#709740022 Setting isDetailLink(false) fixed both problems.

Also the example in the question doesn't fully demonstrate the problem.

Here is a more accurate example

struct ViewX: View {
    @Binding var showNestedView: Bool

    var body: some View {
        VStack{
            Text("ViewX")

            Button(action: { showNestedView = true }) {
                Text("Open ViewY")
            }

            NavigationLink(destination: ViewY(showNestedView: $showNestedView), isActive: $showNestedView) {
                EmptyView()
            }.isDetailLink(false)
        }
    }
}

struct ViewY: View {
    @Binding var showNestedView: Bool

    var body: some View {
        VStack {
            Text("ViewY")
            NavigationLink("Open ViewZ", destination: ViewZ(showNestedView: $showNestedView))
                .isDetailLink(false)
        }
    }
}

struct ViewZ: View {
    @Binding var showNestedView: Bool
    @State var showNestedView2: Bool = false

    var body: some View {
        VStack {
            Text("ViewZ")
            Button(action: { showNestedView = false}) {
                Text("Go back to ViewX")
            }

            NavigationLink("Open ViewX again", destination: ViewX(showNestedView: $showNestedView2))
                .isDetailLink(false)
        }
    }
}

The problem starts occurring when the same view appears multiple times on the stack. In this case ViewZ can open ViewX again. In which case popping back from ViewZ to ViewX stops working unless isDetailLink(false) is used.

   

Save 50% in my Black Friday sale.

SAVE 50% To celebrate WWDC22, all our books and bundles are half price, so you can take your Swift knowledge further without spending big! Get the Swift Power Pack to build your iOS career faster, get the Swift Platform Pack to builds apps for macOS, watchOS, and beyond, or get the Swift Plus Pack to learn advanced design patterns, testing skills, and more.

Save 50% on all our books and bundles!

Sponsor Hacking with Swift and reach the world's largest Swift community!

Reply to this topic…

You need to create an account or log in to reply.

All interactions here are governed by our code of conduct.

 
Unknown user

You are not logged in

Log in or create account
 

Link copied to your pasteboard.