[英]SwiftUI: how to use NavigationView in macOS?
I have two separate Xcode projects that I'm using to learn SwiftUI:我有两个单独的 Xcode 项目用于学习 SwiftUI:
The following code creates a simple NavigationView
with master-detail views:以下代码创建了一个带有主从视图的简单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
It works as expected on iOS 👍它在 iOS 上按预期工作👍
But on the macOS project the same code as above doesn't work the same way 🤯但是在 macOS 项目上,与上面相同的代码并不能以相同的方式工作 🤯
When I launch the app on Mac, I get this window当我在 Mac 上启动应用程序时,我看到这个窗口
And when I click on any row, the detail view just collapses/disappears, never showing me detail view.当我单击任何行时,详细信息视图会折叠/消失,从不显示详细信息视图。
Any ideas how to fix this?任何想法如何解决这一问题? Maybe I'm missing something?也许我错过了什么? Or perhaps this is just a bug?或者这只是一个错误?
Here is my code that seems to fix it using Xcode 12.2 beta 3:这是我的代码,似乎使用 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)
}
}
}
This makes a window like this:这使得一个窗口是这样的:
I don't have the answer but I'm trying to do the same thing and have a few observations to add, maybe they will help:我没有答案,但我正在尝试做同样的事情并有一些观察要添加,也许它们会有所帮助:
Add a destination View:添加目标视图:
NavigationButton(destination: DetailView()) {
Text("Show Detail")
}
Setting a width on the NavigationView stops the right-hand view from disappearing.在 NavigationView 上设置宽度会阻止右侧视图消失。
Also, adding另外,添加
.onAppear { print("DetailView called") }
to the detail view shows that, even though it isn't being displayed, the view is in fact called when the button is clicked.详细视图显示,即使它没有被显示,当单击按钮时实际上会调用该视图。
Edit: it's there!编辑:它在那里! The view was hidden by the divider, drag it left to see the detail view.该视图被分隔线隐藏,将其向左拖动以查看详细视图。
Edit 2: Xcode beta 2 gives a "'NavigationView' is unavailable in macOS" message.编辑 2:Xcode beta 2 给出了“'NavigationView' 在 macOS 中不可用”消息。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.