如何使用 SwiftUI 在 .fullSizeContent 窗口中拥有功能齐全的 NavigationView

Question

我正试图让我的NavigationView 填满整个窗口。 List 应该从其窗口的顶部边缘延伸到底部边缘。但是，虽然列表一开始看起来是正确的，将.fullSizeContentView 添加到NSWindow 的styleMask，但只要我选择一个列表项，整个 NavigationView 就会缩小。

为了防止缩水，我找到了两个选项。

1. 将ZStack 与Color-background 一起使用，这样背景将调整DetailView 的大小。
2. 使用frame-修饰符，其中maxWidth 和maxHeight 是.infinity

这两个选项都会破坏List 的箭头键导航。

使用NavigationView 设置全尺寸内容的正确方法是什么？

以下是复制问题所需的完整工作示例代码。如果您想对其进行测试，只需在 Catalina 上的全新 Swift macOS 应用程序中替换这些文件的内容即可。

AppDelegate.swift

import Cocoa
import SwiftUI

@NSApplicationMain
class AppDelegate: NSObject, NSApplicationDelegate {
    var window: NSWindow!

    func applicationDidFinishLaunching(_ aNotification: Notification) {
        let contentView = ContentView()

        window = NSWindow(
            contentRect: NSRect(x: 0, y: 0, width: 480, height: 300),
            styleMask: [.titled, .closable, .miniaturizable, .resizable, .fullSizeContentView],
            // <---- remove .fullSizeContentView mask and layout will work without option 1 or 2 in ContentView
            backing: .buffered, defer: false)
        window.titlebarAppearsTransparent = true
        window.titleVisibility = .hidden
        window.isReleasedWhenClosed = false
        window.center()
        window.setFrameAutosaveName("Main Window")
        window.contentView = NSHostingView(rootView: contentView)
        window.makeKeyAndOrderFront(nil)
    }
}

ContentView.swift

import SwiftUI

let warners = ["Yacko","Wacko","Dot"]

struct WarnerView: View {
    var name: String
    var body: some View {
//        ZStack { // <---- Option 1: use ZStack with Color.clear
//            Color.clear
            VStack {
                Text(name)
                Text("Nothing to see here!")
            }
//            .frame(minWidth: 100, idealWidth: 100, maxWidth: .infinity, minHeight: 100, idealHeight: 100, maxHeight: .infinity, alignment: .center)
//          <---- Option 2: use only VStack with frame
//        } // <- closing bracket for ZStack
    }
}

struct ContentView: View {
    var body: some View {
        ZStack {
            Color.clear
            NavigationView {
                VStack(alignment: .leading) {
                    HStack {
                        Text("Warners")
                            .font(.headline)
                    }
                        .padding(16)
                    List(warners, id: \.self)
                     { warner in
                        NavigationLink(destination: WarnerView(name: warner)
                        ) {
                            Text(warner)
                        }
                    }.listStyle(SidebarListStyle())
                }
            }
        }
        .edgesIgnoringSafeArea(.all)
        .frame(minWidth: 600, minHeight: 400)
    }
}

Answer 1

据我所知，这是一种方式（使用 Xcode 12 / macOS 10.15.6 测试）。你上面的WarnerView没有变化。

struct ContentView: View {
    var body: some View {
            NavigationView {
                List {
                  HStack {
                        Text("Warners")
                             .font(.headline)
                  }
                  ForEach(warners, id: \.self)
                    { warner in
                        NavigationLink(destination:
                            WarnerView(name: warner)
                                .frame(maxWidth: .infinity, maxHeight: .infinity)
                                ) {
                             Text(warner)
                        }
                  }
                }.listStyle(SidebarListStyle())

// uncomment below for default details area
//                  WarnerView(name: "")
//                      .frame(maxWidth: .infinity, maxHeight: .infinity)
        }
    }
}