SwiftUI(macOS Big Sur)：如何将ToolbarItem对应到右侧视图

这个问题在Xcode 12 Beta + macOS Big Sur Beta的SwiftUI三列布局里确实挺典型的——默认情况下，外层NavigationView会把所有子视图的Toolbar合并到同一区域，导致右侧视图的ToolbarItem跑到左边去。要实现每个列视图拥有独立的工具栏，核心思路是给每个列的内容嵌套独立的NavigationView，并绑定对应的导航标题。

修改后的完整代码 #

import SwiftUI

struct ContentView: View {
    enum NavigationItem {
        case demo
    }
    @State private var selection: Set<NavigationItem> = [.demo]
    
    var body: some View {
        NavigationView {
            // 侧边栏部分保持不变
            List(selection: $selection) {
                Label("Demo", systemImage: "list.bullet")
            }
            .listStyle(SidebarListStyle())
            .frame(minWidth: 200, idealWidth: 250, maxWidth: 300, maxHeight: .infinity)
            
            // 左侧列：嵌套独立NavigationView以绑定专属工具栏
            NavigationView {
                Text("Left")
                    .frame(maxWidth: 500, maxHeight: .infinity)
                    .navigationTitle("Left View") // 关键：必须设置导航标题来关联工具栏
                    .toolbar {
                        ToolbarItem {
                            Button(action: {}) {
                                Text("Left Toolbar")
                            }
                        }
                    }
                    .presentedWindowToolbarStyle(ExpandedWindowToolbarStyle())
            }
            
            // 右侧列：同样嵌套独立NavigationView
            NavigationView {
                Text("Right")
                    .frame(maxWidth: .infinity, maxHeight: .infinity)
                    .navigationTitle("Right View")
                    .toolbar {
                        ToolbarItem {
                            Button(action: {}) {
                                Text("Right Toolbar")
                            }
                        }
                    }
            }
        }
    }
}

关键说明 #

• 嵌套独立NavigationView：每个列的内容都被包裹在自己的NavigationView中，这样每个视图会拥有独立的导航上下文，工具栏会自动绑定到对应的列，不会再出现合并的情况。
• 必须设置navigationTitle：这是SwiftUI识别视图需要独立工具栏的必要条件——如果省略导航标题，工具栏依然会合并到外层的NavigationView中。
• 隐藏导航标题的小技巧：如果不需要显示实际的导航标题，可以设置空字符串代替，工具栏依然能正常工作：

  .navigationTitle("")
  

这个方案在你使用的Xcode 12 Beta和Big Sur Beta环境下可以稳定生效，完美实现三列布局中每个视图的专属ToolbarItem需求。

内容的提问来源于stack exchange，提问作者Felix Marianayagam