SwiftUI 2.0：关闭按钮不会关闭视图 - 如何让关闭按钮返回上一个视图？答案

【问题标题】：SwiftUI 2.0: Close button is not dismissing the view - how do I get the Close button to return to the previous view?SwiftUI 2.0：关闭按钮不会关闭视图 - 如何让关闭按钮返回上一个视图？
【发布时间】：2021-01-02 19:43:58
【问题描述】：

在此频道和网络上进行研究时，我尝试使用各种示例中的按钮和导航链接。 NavigationLink 没问题，只是 NavigationView 在我的视图中将所有内容都向下推。

我有一个包含这样的图像和文本的视图：( x 关闭) 但是当我使用下面的代码时，关闭按钮没有做任何事情。

在ContentView() 中，我有一个 (?) 按钮，可以将我从 WalkthroughView() 带到 PageTabView，然后到这个视图 TabDetailsView：

内容视图（）：

ZStack {
        NavigationView {
            VStack {
                Text("Hello World")
                    .padding()
                    .font(.title)
                    .background(Color.red)
                    .foregroundColor(.white)
            }
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Button {
                        withAnimation {
                            showOnBoarding = true
                        }
                    } label: {
                        Image(systemName: "questionmark.circle.fill")
                    }
                }
            }
        }
        .accentColor(.red)
        .disabled(showOnBoarding)
        .blur(radius: showOnBoarding ? 3.0 : 0)
        
        if showOnBoarding {
            WalkthroughView(isWalkthroughViewShowing: $isWalkthroughViewShowing)
        }
    }
    .onAppear {
        if !isWalkthroughViewShowing {
            DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
                withAnimation {
                    showOnBoarding.toggle()
                    isWalkthroughViewShowing = true
                }
            }
        }
    }

WalkthroughView()：

var body: some View {
    ZStack {
        GradientView()
        VStack {
            PageTabView(selection: $selection)

            // shows Previous/Next buttons only
            ButtonsView(selection: $selection) 
        }
    }
    .transition(.move(edge: .bottom))
}

PageTabView():

var body: some View {
    TabView(selection: $selection) {
        ForEach(tabs.indices, id: \.self) { index in
            TabDetailsView(index: index)
        }
    }
    .tabViewStyle(PageTabViewStyle())
}

下面是 TabDetailsView()：

在视图的顶部是这个关闭按钮，当按下时，应该将我发送回 ContentView，但什么都没有发生。

struct TabDetailsView: View {
    @Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
    let index: Int

然后，在体内：

VStack(alignment: .leading) {
        Spacer()
        VStack(alignment: .leading) {
            // Button to close each walkthrough page...
            Button(action: {
                self.presentationMode.wrappedValue.dismiss()
            }) {
                Image(systemName: "xmark.circle.fill")
                Text("Close")
            }
            .padding(.leading)
            .font(.title2)
            .accentColor(.orange)

            Spacer()
            VStack {
                Spacer()
                Image(tabs[index].image)
                    .resizable()
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 415)
                    .padding(.leading, 10)
                
                Text(tabs[index].title)
                    .font(.title)
                    .bold()
                
                Text(tabs[index].text)
                    .padding()
                Spacer()
            }
            .foregroundColor(.white)
        }
    }

【问题讨论】：

TabDetailsView 是如何呈现的？
ContentView() 调用 WalkthroughView() 调用 PageTabView() 然后调用 TabDetailsView()
但是如何呈现？ sheet? NavigationLink?还要别的吗？你能添加更多代码吗？
@pawello2222 在我上面的问题中添加了更多代码。

标签： swiftui ios14

【解决方案1】：

    if showOnBoarding {
        WalkthroughView(isWalkthroughViewShowing: $isWalkthroughViewShowing)
    }

像上面那样插入视图不是标准意义上的演示文稿，这就是提供的代码不起作用的原因。

由于此视图通过showOnBoarding 显示，它也应通过showOnBoarding 隐藏，因此解决方案是将绑定到此状态传递到视图中，它将被切换回。

由于层次结构较深，最合适的方法是使用自定义环境值。为简单起见，让我们使用 https://stackoverflow.com/a/61847419/12299030 中的 ResetDefault（您可以在代码中重命名）

所以需要修改：

    if showOnBoarding {
        WalkthroughView(isWalkthroughViewShowing: $isWalkthroughViewShowing)
          .environment(\.resetDefault, $showOnBoarding)
    }

在子视图中

struct TabDetailsView: View {
    @Environment(\.resetDefault) var showOnBoarding

    // .. other code

            Button(action: {
                self.showOnBoarding.wrappedValue.toggle() 
            }) {
                Image(systemName: "xmark.circle.fill")
                Text("Close")
            }

【讨论】：