SwiftUI:如何在macOS中使用NavigationView?

时间:2019-06-16 08:11:55

标签: ios macos swiftui

我有两个用于学习SwiftUI的Xcode项目:

  1. Mac上的真实macOS项目(不是Catalyst)。
  2. 一个iOS项目(iPhone)。

以下代码创建一个具有主从视图的简单NavigationView

import SwiftUI

struct ListView : View {
    var body: some View {
        NavigationView {
            List() {
                NavigationButton(destination: Text("detail 1")) {
                    Text("row 1")
                }
                NavigationButton(destination: Text("detail 2")) {
                    Text("row 2")
                }
            }
        }
    }
}

#if DEBUG
struct ListView_Previews : PreviewProvider {
    static var previews: some View {
        ListView()
    }
}
#endif

它可以在iOS?上正常工作

但是在macOS项目上,与上面相同的代码不能以相同的方式工作?

在Mac上启动该应用程序时,会显示此窗口

enter image description here

当我单击任何行时,详细信息视图只会折叠/消失,而不会显示详细信息视图。

enter image description here

有什么办法解决此问题吗?也许我缺少什么?也许这只是一个错误?

2 个答案:

答案 0 :(得分:1)

我没有答案,但我正在尝试做同样的事情,并且有几点补充,也许它们会有所帮助:

添加目标视图:

NavigationButton(destination: DetailView()) {
            Text("Show Detail")
        }

在NavigationView上设置宽度可以阻止右侧视图消失。

还添加

 .onAppear { print("DetailView called") } 
对详细视图的

显示,即使未显示该视图,实际上在单击该按钮时也会调用该视图。

编辑:就在这里!该视图已被分隔线隐藏,将其向左拖动即可查看详细视图。

编辑2:Xcode beta 2给出“ macOS上不存在'NavigationView'”消息。

答案 1 :(得分:0)

这是我的代码,似乎可以使用Xcode 12.2 beta 3对其进行修复:

import SwiftUI

var listItems = ["Item 1", "Item 2", "Item 3", "Item 4"]
var secondItems = ["Second 1", "Second 2", "Second 3", "Second 4"]

struct ContentView: View
{
    
    @State var select: String? = "Item 1"
    var body: some View
    {
        VStack
        {
            NavigationView
            {
                List
                {
                    ForEach((0..<listItems.count), id: \.self)
                    {index in
                        NavigationLink(destination: SecondView(), tag: listItems[index], selection: $select)
                        {
                            Text(listItems[index])
                                .padding(.vertical, 2.0)
                        }
                    }
                    Spacer()
                    
                }.frame(width:160)
                                .listStyle(SidebarListStyle())
            }
            
            .toolbar
            {
                Text("this is not the title")
                Button(action: {})
                {
                    Label("Upload", systemImage: "square.and.arrow.up")
                }
            }
            .navigationTitle("My Title")
            .navigationViewStyle(DoubleColumnNavigationViewStyle())
        }
    }
}

struct SecondView: View {

    var body: some View {
        NavigationView {
            List
            {
                ForEach((0..<secondItems.count), id: \.self)
                {index in
                    NavigationLink(destination: Text(secondItems[index]))
                    {
                        Text(secondItems[index])
                            .frame(height: 20)
                    }
                }
            }.frame(width:150)
        }
    }
}

这将形成一个这样的窗口:

enter image description here