SwiftUI for Mac:如何添加窗口文件名并居中工具栏
macOS SwiftUI 实现标题显示且工具栏居中的方案
问题核心
默认NSWindow的标题栏会为系统标题预留一半宽度的占位空间,导致自定义工具栏被挤到右侧;直接隐藏标题可见性虽能让工具栏居中,但会丢失文件名显示。以下是两种可行解决方案:
方案一:调整系统标题栏布局(无需自定义标题)
通过修改NSWindow的标题栏属性,移除默认占位空间的同时保留标题显示:
struct ContentView: View { var body: some View { VStack { Text("Main Content") // 你的主内容区域 } .toolbar { // 自定义工具栏内容 Button("操作1") {} Button("操作2") {} } .onAppear { guard let window = NSApplication.shared.windows.first else { return } window.title = "fileName" // 移除标题栏默认背景与占位空间 window.titlebarAppearsTransparent = true // 保持标题可见,让工具栏自动居中 window.titleVisibility = .visible // 可选:启用全尺寸内容视图,让标题栏与内容无缝衔接 window.styleMask.insert(.fullSizeContentView) } } }
原理:titlebarAppearsTransparent会消除系统标题栏默认的占位Spacer,titleVisibility = .visible保留文件名显示,此时SwiftUI的工具栏会自动居中布局,不会被标题挤到右侧。
方案二:完全自定义标题栏(更高灵活性)
通过ToolbarItem的principal位置放置自定义标题,让工具栏元素围绕标题居中排列:
struct ContentView: View { var body: some View { VStack { Text("Main Content") // 你的主内容区域 } .toolbar { // 将自定义标题放在principal位置,替换系统默认标题 ToolbarItem(placement: .principal) { Text("fileName") .font(.headline) } // 工具栏按钮会自动围绕标题居中布局 Button("操作1") {} Button("操作2") {} } .onAppear { guard let window = NSApplication.shared.windows.first else { return } // 隐藏系统默认标题,避免与自定义标题冲突 window.titleVisibility = .hidden // 启用全尺寸内容视图,优化布局衔接 window.styleMask.insert(.fullSizeContentView) } } }
原理:principal位置的工具栏项会作为标题栏的核心元素,系统自动调整两侧工具栏元素的布局,实现标题与工具栏的居中协同显示。
注意事项
- 测试时使用标准窗口尺寸,避免小窗口导致布局挤压
- 启用全尺寸内容视图后,若主内容被标题栏遮挡,可添加
padding(.top, 20)适配
内容的提问来源于stack exchange,提问作者Keith
相关产品推荐
相关产品推荐

