企业官网建设流程全解析

macOS 窗口与工具栏样式参考

适用于 macOS SwiftUI 应用的窗口配置、工具栏样式、尺寸、定位和导航模式。

目录

• 快速查找表
• 工具栏样式
• 窗口样式
• 窗口尺寸
• MenuBarExtra 样式（macOS 专属）
• 导航布局（macOS 行为）
• 命令与键盘
• 最佳实践

快速查找表

工具栏样式

windowToolbarStyle（macOS 专属）

控制工具栏和标题栏的显示方式。应用于场景。

@mainstructMyApp:App{varbody:someScene{WindowGroup{ContentView()}// 标题栏和工具栏在同一行.windowToolbarStyle(.unified)}}

可用样式：

// Unified compact — 最小化边框.windowToolbarStyle(.unifiedCompact)// Expanded — 标题栏在工具栏上方.windowToolbarStyle(.expanded)// Unified 且隐藏标题.windowToolbarStyle(.unified(showsTitle:false))

工具栏内容

structContentView:View{@StateprivatevarsearchText=""varbody:someView{NavigationSplitView{SidebarView()}detail:{DetailView()}.toolbar{ToolbarItem(placement:.automatic){Button(action:addItem){Label("Add",systemImage:"plus")}}}.searchable(text:$searchText,placement:.sidebar)}}

窗口样式

windowStyle

设置窗口的视觉样式。对无边框、沉浸式窗口使用.hiddenTitleBar。

// 标准标题栏（默认）WindowGroup{ContentView()}.windowStyle(.titleBar)// 隐藏标题栏 — 无边框窗口WindowGroup{ContentView()}.windowStyle(.hiddenTitleBar)

使用场景：.hiddenTitleBar对媒体播放器、自定义边框应用或不需要标准标题栏的沉浸式体验很有用。

窗口尺寸

windowResizability、defaultSize、defaultPosition

这些修饰符协同配置窗口尺寸和位置：

WindowGroup{ContentView().frame(minWidth:600,minHeight:400)}.defaultSize(width:900,height:600).defaultPosition(.center).windowResizability(.contentMinSize)

windowResizability选项：

defaultPosition选项：.center、.topLeading、.top、.topTrailing、.leading、.trailing、.bottomLeading、.bottom、.bottomTrailing

指南：

• 通过内容上的.frame()设置minWidth/minHeight，用.contentMinSize强制执行
• 使用.defaultSize()设置初始尺寸（大于最小值）
• defaultSize也接受CGSize

windowIdealPlacement（macOS 15.0+）

如需精确的编程式定位，使用带显示几何信息的闭包：

.windowIdealPlacement{contextinletscreen=context.defaultDisplay.visibleAreareturnWindowPlacement(x:screen.midX,y:screen.midY,width:screen.width/2,height:screen.height)}

MenuBarExtra 样式（macOS 专属）

在MenuBarExtra的下拉菜单和弹出面板之间选择。

// 下拉菜单（默认）MenuBarExtra("Status",systemImage:"chart.bar"){Button("Action"){/* ... */}}.menuBarExtraStyle(.menu)// 带自定义 SwiftUI 内容的弹出面板MenuBarExtra("Status",systemImage:"chart.bar"){DashboardView()}.menuBarExtraStyle(.window)

导航布局（macOS 行为）

NavigationSplitView

在 macOS 上，NavigationSplitView并排显示列（从不错叠）。侧边栏获得半透明材质背景。列支持用户调整可变宽度。

NavigationSplitView{List(items,selection:$selectedId){iteminText(item.name)}.navigationSplitViewColumnWidth(min:180,ideal:220,max:300)}detail:{DetailView(id:selectedId)}.navigationSplitViewStyle(.balanced)

对主-从-从布局使用三列变体（sidebar/content/detail）。使用.navigationSplitViewColumnWidth(min:ideal:max:)自定义列宽。

Inspector（macOS 14.0+）

用于补充信息的尾缘面板。在 macOS 上，它显示为侧边栏式面板，可以通过拖动其边缘调整大小。

structContentView:View{@StateprivatevarshowInspector=falsevarbody:someView{MainContent().inspector(isPresented:$showInspector){InspectorView().inspectorColumnWidth(min:200,ideal:250,max:400)}.toolbar{ToolbarItem{Button{showInspector.toggle()}label:{Label("Inspector",systemImage:"info.circle")}}}}}

命令与键盘

Commands、CommandGroup、CommandMenu

定义菜单栏命令。在 macOS 上，这些直接填充菜单栏。在 iOS 上，它们创建按键命令。

.commands{CommandMenu("Tools"){Button("Run Analysis"){/* ... */}.keyboardShortcut("r",modifiers:[.command,.shift])}CommandGroup(after:.newItem){Button("New From Template..."){/* ... */}}}

CommandGroup位置选项：.replacing(_:)替换系统组，.before(_:)/.after(_:)插入到其旁边。常见位置：.newItem、.saveItem、.help、.toolbar、.sidebar。

KeyboardShortcut

在 macOS 上，快捷键显示在菜单项旁边，并显示在悬停时的按钮提示中。

Button("Save"){save()}.keyboardShortcut("s",modifiers:.command)Button("Delete"){delete()}.keyboardShortcut(.delete,modifiers:.command)

openWindow

以编程方式打开窗口。如果目标窗口已打开，则将其前置。

structToolbarActions:View{@Environment(\.openWindow)privatevaropenWindowvarbody:someView{Button("Connection Doctor"){openWindow(id:"connection-doctor")}Button("Show Message"){openWindow(value:message.id)// 与 WindowGroup 类型匹配}}}

最佳实践

• 大多数应用使用.unified或.unifiedCompact—— 只有需要大量工具栏项时才用.expanded
• 在内容上设置最小 frame 尺寸并使用.windowResizability(.contentMinSize)强制执行
• 始终提供defaultSize，让新窗口以合理的尺寸启动
• 侧边栏导航使用NavigationSplitView—— 而不是HSplitView
• 补充面板使用Inspector—— 它自动与工具栏集成
• 为所有可重复动作定义Commands—— macOS 用户期望键盘快捷键
• 用#if os(macOS)包裹 macOS 专属的窗口配置，用于多平台项目