SwiftUI NavigationView 与列表编程导航不起作用

Question

我正在尝试在 NavigationView 中进行编程导航，但由于某种原因，我无法在视图之间切换。 从父视图切换时，一切正常 - 但是当我在其中一个子视图中尝试切换时，我会得到这种奇怪的行为（屏幕来回切换）。 我尝试禁用动画，但这没有帮助。 奇怪的是，如果我与.navigationViewStyle(StackNavigationViewStyle())一起删除一个列表，一切都会开始工作 - 但我需要一个列表。

这似乎有点类似于Deep programmatic SwiftUI NavigationView 导航，但我没有深度嵌套，它仍然不起作用。

我正在使用 iOS 14。

struct TestView: View {
    @State private var selection: String? = nil

    var body: some View {
        VStack {
            NavigationView {
                VStack {
                    List {
                        NavigationLink(destination: Text("View A"), tag: "A", selection: self.$selection) { Text("A") }
                        NavigationLink(destination: Text("View B"), tag: "B", selection: self.$selection) { Text("B") }
                    }
                }
                .navigationTitle("Navigation")
            }
            .navigationViewStyle(StackNavigationViewStyle())
            Button("Tap to show A") {
                selection = "A"
            }.padding()
            Button("Tap to show B") {
                selection = "B"
            }.padding()
        }
    }
}

struct TestView_Previews: PreviewProvider {
    static var previews: some View {
        TestView()
    }
}

这是我得到的行为：

Answer 1

导航视图/链接旨在直接从父级操作到子级，如果您破坏了该顺序，则不应通过 NavLink 使用导航。

您需要做的是使用我认为可以很好地解决您的问题的fullScreenCover 。 复制并粘贴代码以了解我的意思。

import SwiftUI

struct TestNavView: View {
    @State private var selection: String? = nil
    @State private var isShowing = false
    @Environment(\.presentationMode) var pMode

    var body: some View {
        VStack {
            NavigationView {
                VStack {
                    List {
                        NavigationLink(destination: Text("View A"), tag: "A", selection: self.$selection) { Text("A") }
                        NavigationLink(destination: Text("View B"), tag: "B", selection: self.$selection) { Text("B") }
                    }.fullScreenCover(isPresented: $isShowing, content: {
                        CView()
                    })
                    
                }
                .navigationTitle("Navigation")
            }
            .navigationViewStyle(StackNavigationViewStyle())
            Button("Tap to show A") {
                selection = "A"
            }.padding()
            Button("Tap to show B") {
                isShowing = true
                selection = "B"
            }.padding()
            Button("Tap to show C") {
                isShowing = true
            }.padding()
        }
    }
}

struct TestView_Previews: PreviewProvider {
    static var previews: some View {
        TestNavView()
    }
}

struct CView: View {
    @Environment(\.presentationMode) var pMode
    var body: some View {
        VStack {
            Button("Back") {self.pMode.wrappedValue.dismiss() }
            Spacer()
        Text("C")
            Spacer()
        }

    }
}

Answer 2

如果您只希望呈现的视图占据屏幕的一半，我建议使用 ZStack 将视图呈现在主 window 的顶部。 您可以将自己的自定义后退按钮添加到左上角（或其他位置）。 这将允许两种视图轻松呈现和切换。 您还可以添加 withAnimation() 以使叠加的视图很好地呈现。