屏幕底部显示的SwiftUI详细信息视图

时间:2020-04-19 17:02:29

标签: swiftui swiftui-navigationlink

我正在使用SwiftUI从列表的行创建NavigationLink,以详细显示NavigationView中的视图。在我的CustomView中,我有2个组:

  1. 第一组包含应用程序徽标和搜索栏
  2. 第二个包含带有NavigationLink的列表(我用来显示搜索结果)

当我使用NavigationLink显示行的详细信息时,它可以工作,但是我的RetailerView()显示在屏幕底部。

var body: some View {

    VStack {
        // Logo
        Group {
                Spacer()
                LogoView()
                Spacer()
        }
        // search bar
        Group {
            TextField("search you retailer...", text:$search, onCommit: searchRetailer)
                .disableAutocorrection(true).font(.body).frame(width: 270, height: 30, alignment: .center).padding().textFieldStyle(RoundedBorderTextFieldStyle()).autocapitalization(UITextAutocapitalizationType.none)
            Spacer()
        }

        if(self.retailersList.count == 0){
            Text("No results found!")
        }else{
            Group {
                VStack {
                    NavigationView {
                        List {
                            ForEach(retailersList) { retailer in
                                NavigationLink(destination: RetailerView()){

                                    RetailerRaw(retailer: retailer, color: self.computeColor(retailer: retailer))

                                }.isDetailLink(true)
                            }
                        }.listStyle(GroupedListStyle())
                    } //end NavigationView
                }
            }

        }
        Spacer()
    } //end VStack
} //end body

1 个答案:

答案 0 :(得分:0)

您必须将NavigationView放在所有内容之上。 将NavigationView放在VStack的顶部(var body: some View {之后)