如何确定有多少“NavigationSplitView”列可见？

Question

概述

• 我正在使用NavigationSplitView ，可见的列数可能因设备（macOS、iPhone、iPad）以及它是否使用分屏（iPad 可以同时运行 2 个应用程序）而异。

问题

1. 在NavigationSplitView中如何确定有多少列可见？
2. 或者如何确定视图是否被推送？
3. 或者视图是滑过（iPad 边栏滑过）？

背景

提问原因：我有一个 sidebarList、contentList 和 detailList。 现在我想根据可见的列数选择不同的单元格

示例代码：

struct ContentView: View {
    @State private var departments = ["D1"]
    @State private var employees = ["E1", "E2", "E3"]
    @State private var selectedDepartment: String?
    @State private var selectedEmployee: String?

    var body: some View {
        NavigationSplitView {
            List(departments, id: \.self, selection: $selectedDepartment) { department in
                Text(department)
            }
        } content: {
            List(employees, id: \.self, selection: $selectedEmployee) { employee in
                Text(employee)
            }
        } detail: {
            if let selectedEmployee {
                Text(selectedEmployee)
            } else {
                Text("No employee selected")
            }
        }
    }
}

Answer 1

您可以在初始化程序中使用 NavigationSplitViewVisibility 结构。

@State private var columnVisibilty: NavigationSplitViewVisibility = .all

这将是 3 列设计的示例。 通过读取或更改 state 变量，您可以控制它。 （因此绑定，系统设置它当前显示的内容）为清楚起见添加

NavigationSplitView(columnVisibility: $columnVisibilty) sidebar: {
...
} content: {
...
} detail: {
...
}

这是苹果文档的链接： https://developer.apple.com/documentation/swiftui/navigationsplitviewvisibility

添加了粗略的示例：

struct ContentView: View {
    @State private var columnVisibility: NavigationSplitViewVisibility = .all
    var body: some View {
        NavigationSplitView(columnVisibility: $columnVisibility) {
            Text("Sidebar:")
                .toolbar {
                    Button("Print") {
                        print(columnVisibility)
                    }
                }
        } content: {
            Text("Content:")
                .toolbar {
                    Button("Print") {
                        print(columnVisibility)
                    }
                }
        } detail: {
            Text("Detail:")
                .toolbar {
                    Button("Print") {
                        print(columnVisibility)
                    }
                }
        }
        
    }
}

这让我可以设置一个初始设置，但它会根据 SplitView 的当前状态进行更新。 只需按下打印按钮，您就可以看到更改。