使用SwiftUI自定义macOS工具栏时背景色无法全局生效问题求助

你当前的写法之所以只给工具栏内元素加上背景，是因为SwiftUI的.toolbar修饰符传入的内容只会渲染在原生NSToolbar的内容区域，你给内容加的background不会作用到整个NSToolbar容器上。下面提供两种可行的解决方案：

方案1：修改原生NSToolbar的背景色（推荐） #

这个方案完全保留原生工具栏的所有特性，自动适配侧边栏折叠展开、窗口交通灯位置、全屏状态，不需要额外处理布局适配。
首先实现获取当前窗口的工具扩展：

struct WindowAccessor: NSViewRepresentable {
    let onWindowGet: (NSWindow?) -> Void
    
    func makeNSView(context: Context) -> NSView {
        let view = NSView()
        DispatchQueue.main.async {
            onWindowGet(view.window)
        }
        return view
    }
    
    func updateNSView(_ nsView: NSView, context: Context) {}
}

extension View {
    func toolbarBackgroundColor(_ color: Color) -> some View {
        self.background(WindowAccessor { window in
            window?.toolbar?.backgroundColor = NSColor(color)
        })
    }
}

使用方法非常简单，直接给你的NavigationView加上修饰符即可：

struct ContentView: View {
    var body: some View {
        NavigationView {
            Collections()
                .layoutPriority(0)
            
            Photos()
                    .frame(maxWidth: .infinity, minHeight: 300, maxHeight: .infinity)
                    .background(Color.Alt.black)
                    .layoutPriority(1)
        }
        .toolbar {
            // 保留原有工具栏内容，不需要单独加background
            Toolbar()
        }
        // 新增这一行修改整个工具栏背景
        .toolbarBackgroundColor(Color.red500)
    }
}

如果需要全应用所有窗口的工具栏都使用统一背景色，也可以直接在App启动时设置全局外观：

// 在你的App结构体的init方法中添加即可
init() {
    NSToolbar.appearance().backgroundColor = NSColor(Color.red500)
}

方案2：自定义工具栏适配布局 #

如果你确实需要完全自定义工具栏的交互和样式，可以用safeAreaInset自动适配窗口交通灯的安全边距，不需要手动计算偏移量：

struct ContentView: View {
    var body: some View {
        NavigationView {
            Collections()
                .layoutPriority(0)
            
            Photos()
                    .frame(maxWidth: .infinity, minHeight: 300, maxHeight: .infinity)
                    .background(Color.Alt.black)
                    .layoutPriority(1)
        }
        // 顶部插入自定义工具栏，系统自动适配安全边距
        .safeAreaInset(edge: .top, spacing: 0) {
            Toolbar()
                .frame(height: 52) // 标准macOS工具栏高度
                .background(Color.red500)
        }
        // 隐藏原生工具栏的占位区域
        .windowToolbarStyle(.unifiedCompact(showsTitle: false))
    }
}

这个方案不管侧边栏是展开还是折叠，系统都会自动给交通灯留出左侧边距，不会出现布局错乱的问题。

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