从另一个视图关闭一个视图

Question

我还在学习SwiftUI，遇到了一个小问题。

在我的应用程序中，我有一个主视图。顶部是搜索栏，底部是带有不同按钮的菜单。单击这些按钮时，我想更改视图。不过，我只想改中间的部分。

没什么大不了的，我把中间的部分放到一个NavigationView里就行了。这很好，我可以改变我的观点。我的问题是下面的按钮对新视图没有任何影响。

尝试简化：假设我在主页上。然后我点击杂货清单按钮（猜猜我在做什么学校项目哈哈）。我的导航 link 工作正常并转到列表。所以，现在我在视图 2 上。当我按下主页按钮时，它不会关闭该视图并转到我的主视图。这是我的代码设置：

import SwiftUI

struct ContentView: View {
    @State private var searchText: String = ""
    @State private var action: Int? = 0
    
    var body: some View {
    
        ZStack {
            
            // Top Menu
            
            VStack{
                HStack {
                    Spacer()
                    TextField("Search",
                              text: $searchText)
                        .background(Color.white)
                        
                    Button(action: {
                        self.action = 1
                    }, label: {
                        Image(systemName: "magnifyingglass.circle")
                            .font(.largeTitle)
                    })
                    Spacer()
                }
                
                // Body
                
                NavigationView {
                            VStack {
                                Text("Can I See Something")
                                NavigationLink(destination: SearchView(), tag: 1, selection: $action) {
                                }
                                Text("Yes/No")
                            }
                        }
                
                Spacer()
                
                // Bottom Menu
                
                HStack (alignment: .top) {
                    Spacer()
                    VStack {
                        Button(action: {
                            
                        }, label: {
                            Image(systemName: "house.fill")
                                .font(.largeTitle)
                        })
                            .padding(.top)
                        Text("Home")
                    }
                    Divider()
                        .padding(.horizontal)
                        .frame(width: 2.5, height: 100)
                    VStack {
                        Button(action: {
                            
                        }, label: {
                            Image(systemName: "newspaper")
                                .font(.largeTitle)
                        })
                            .padding(.top)
                        Text("Weekly\nAd")
                            .multilineTextAlignment(.center)
                    }
                    Divider()
                        .padding(.horizontal)
                        .frame(width: 2.5, height: 100)
                    VStack {
                        Button(action: {
                            
                        }, label: {
                            Image(systemName: "checklist")
                                .font(.largeTitle)
                        })
                            .padding(.top)
                        Text("Grocery\nList")
                            .multilineTextAlignment(.center)
                    }
                    Divider()
                        .padding(.horizontal)
                        .frame(width: 2.5, height: 100)
                    VStack {
                        Button(action: {
                            
                        }, label: {
                            Image(systemName: "person.crop.circle")
                                .font(.largeTitle)
                        })
                            .padding(.top)
                        Text("Account")
                    }
                    Spacer()
                }
            }
        }
    }
}

struct SearchView: View {
    var body: some View {
        ZStack {
            Text("Nothing to see here!")
        }
        .navigationBarBackButtonHidden(true)
    }
    
}

SearchView 是应用程序中的一个单独视图（在其自己的文件中），按下放大镜按钮时会打开该视图。目前它什么都不做。但是我希望能够在上面的这个视图中按下这些按钮来继续导航应用程序。

另外，请注意，是否可以取消后退按钮？

Answer 1

在您的代码中，按钮没有任何功能。与其自己创建一个标签栏，我宁愿采用类似的东西：

import SwiftUI

struct ContentView: View {
    var body: some View {
        TabView {
            MainView()
                .tabItem {
                    Label("Home", systemImage: "house.fill")
                }

            NewsView()
                .tabItem {
                    Label("Weekly\nAd", systemImage: "newspaper")
                }
        
            OrderView()
                .tabItem {
                    Label("Grocery\nList", systemImage: "checklist")
                }
        
            AccountView()
                .tabItem {
                    Label("Account", systemImage: "person.crop.circle")
                }
        }
    }
}

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

struct MainView: View {
    var body: some View {
        Text("Home View")
    }
}

struct NewsView: View {
    var body: some View {
        Text("News View")
    }
}

struct OrderView: View {
    var body: some View {
        Text("Order View")
    }
}

struct AccountView: View {
    var body: some View {
        Text("Account View")
    }
}

在这种情况下，您必须为您正在配置的每个选项卡创建一个视图（请参阅最后 4 个结构）。

如果您想使用带有您自己创建的按钮的 Stack 来完成此操作，我认为您还应该创建所有 4 个视图，然后您要么隐藏它们，要么通过使用偏移将它们置于焦点之外。在这种情况下，按钮应该 hide/show 特定视图或相应地更改偏移量以将特定视图移动到可见区域。使用偏移量，您还可以添加一些动画。

关于您应用顶部的搜索栏，由于视图各不相同，我不会在所有地方都保留相同的搜索栏，但如果您真的想要那样，您可以嵌入代码 +将您的搜索栏放入 VStack（就像您在示例中所做的那样）。

从另一个视图关闭一个视图

Closing A View From Another View

back-button

navigationview

swiftui

swiftui-navigationlink