按钮,如何在嵌入导航栏的swiftUI中打开一个新视图

Button, how to open a new View in swiftUI embedded in navigation bar

我在 NavigationBar 上嵌入了一个按钮。 我尝试制作按钮来打开一个名为 DetailView

的新 View

我尝试使用 NavigationLink 但它在按钮内不起作用。

import SwiftUI

struct ContentView: View {

    @ObservedObject var dm: DataManager

    @State var isAddPresented = false
    var body: some View {
        NavigationView {
            HStack {
                List () {
                    ForEach (dm.storage) { data in
                        StileCella(dm2: data)
                    }
                }
                .navigationBarTitle("Lista Rubrica")
                .navigationBarItems(trailing: Button(action: {
                        self.isAddPresented = true
                   // Load here the DetailView??? How??
                        DetailView()
                    }) {
                        Text("Button")
                    })
            }
        }
    }
}



struct DetailView: View {

    var body: some View {
        VStack(alignment: .center) {
            Text("CIAO").bold()
            Spacer()
            Image(systemName: "star")
                .resizable()
        }
    }
}

你只需要在你的视图中添加一个sheet修饰符,它根据isAddPresented的值呈现你的视图,就像这样:

struct ContentView: View {

    @State var isAddPresented = false

    var body: some View {
        NavigationView {
            List(dm.storage){ data in
                StileCella(dm2: data)
            }
            .navigationBarTitle("Lista Rubrica")
            .navigationBarItems(trailing: Button("Button") {
                self.isAddPresented = true
            })
        }   .sheet(isPresented: $isAddPresented,
                   onDismiss: { self.isAddPresented = false }) {
                        DetailView()
                    }
    }
}

重要的是要记住在关闭时将 isAddPresented 设置回 false 以防止它再次呈现。

除了sheet之外,如果你想像我们以前通过storyboard打开一样打开一个新视图,你可以通过以下方式更新代码:

import SwiftUI

struct ContentView: View {

    @ObservedObject var dm: DataManager

    @State var isAddPresented = false
    var body: some View {
        NavigationView {
            HStack {
                List () {
                    ForEach (dm.storage) { data in
                        StileCella(dm2: data)
                    }
                }
                .navigationBarTitle("Lista Rubrica")
                .navigationBarItems(leading:
                    NavigationLink(destination: DetailView()) {
                    Text("Button")
                })
            }
        }
    }
}



struct DetailView: View {

    var body: some View {
        VStack(alignment: .center) {
            Text("CIAO").bold()
            Spacer()
            Image(systemName: "star")
                .resizable()
        }
    }
}

而不是按钮,只需在 navigationBarItems 中添加 NavigationLink。这样就可以了!我写了完整的指南,但主要的变化点是,我使用了

.navigationBarItems(leading:
      NavigationLink(destination: DetailView()) {
           Text("Button")
      })

而不是:

.navigationBarItems(trailing: Button(action: {
     self.isAddPresented = true
      // Load here the DetailView??? How??
         DetailView()
     }) {
            Text("Button")
     })