Question

我目前正在构建一个三列布局应用程序，其布局结构可以这样描述：

Sidebar(List) | Primary(List) | Detail(DetailView)

在此设置中，Detail 视图本身也可以呈现一个 ExtraDetail 视图，可以显示更多信息。视图本身定义如下：

struct Detail: View {
    let page: Int
    
    var body: some View {
        NavigationLink("Detail \(page)", destination: Text("Extra Detail"))
    }
}

struct ExtraDetail: View {
    var body: some View {
        Text("Extra Detail")
    }
}

struct Primary: View {
    var body: some View {
        List {
            ForEach(1..<5, id: \.self) { number in
                NavigationLink("\(number)", destination: Detail(page: number))
            }
        }
    }
}

struct Sidebar: View {
    var body: some View {
        List {
            NavigationLink("Primary", destination: Primary())
        }.listStyle(SidebarListStyle())
    }
}

所有视图都在 ContentView 中绑定在一起以启用三列布局：

struct ContentView: View {
    var body: some View {
        NavigationView {
            Sidebar()
            Text("Placeholder")
            Text("Placeholder")
        }
    }
}

虽然此布局在 iPad（或具有常规水平尺寸等级的场景）上运行良好，但一旦视图从 Detail 变为 ExtraDetail，它在 iPhone（或具有紧凑水平尺寸等级的任何地方）上会中断视图（这是堆栈中的第四个视图）。在 iPhone 上，它会产生闪烁和以下错误消息：

[Assert] displayModeButtonItem is internally managed and not exposed for TripleColumn style. Returning an empty, disconnected UIBarButtonItem to fulfill the non-null contract.

在导航栏中的 ExtraDetail 视图中点击 Back 按钮会将用户直接返回到 Primary 视图而不是 Detail 视图。

我已将 .navigationViewStyle(StackNavigationViewStyle()) 添加到主 NavigationView，但这完全破坏了三列布局和样式。有没有办法在不破坏布局的情况下实现这个四视图导航堆栈？

iPhone 上的三列布局问题

0 个答案: