SwiftUI 如何实现随内容适配颜色的 macOS 工具栏?
结论
SwiftUI 可以设置 macOS 窗口工具栏的背景可见性、背景样式和颜色方案,但不会自动分析主视图的像素来切换标题颜色。若要让标题或工具栏文字随文档内容变化,应用需要根据自身的内容状态选择合适的 ColorScheme,并将其应用到 .windowToolbar。
.toolbarBackgroundVisibility(.hidden, for: .windowToolbar) 控制的是工具栏背景是否显示,不会根据中间视图的颜色调整标题。SwiftUI 的 .toolbarBackground 和 .toolbarColorScheme 分别用于设置工具栏背景样式和颜色方案。Apple 文档:toolbarBackgroundVisibility;Apple 文档:toolbarColorScheme
设置半透明工具栏
可以使用系统材质作为工具栏背景,并指定浅色或深色内容方案:
struct EditorView: View {
@State private var toolbarScheme: ColorScheme = .light
var body: some View {
HStack(spacing: 0) {
SidebarView()
ArtworkView()
InspectorView()
}
.toolbarBackground(.ultraThinMaterial, for: .windowToolbar)
.toolbarBackgroundVisibility(.visible, for: .windowToolbar)
.toolbarColorScheme(toolbarScheme, for: .windowToolbar)
}
}
SidebarView、ArtworkView 和 InspectorView 是应用的三个区域。将 .windowToolbar 修饰符放在能影响窗口工具栏的视图层级上。视图容器结构不同,修饰符的位置也可能需要调整。
如果希望工具栏背景完全透明,可以使用 .toolbarBackgroundVisibility(.hidden, for: .windowToolbar)。这会隐藏背景,但不会替应用判断文字颜色。
根据内容切换文字颜色方案
应用可以根据已有的内容状态来设置 toolbarScheme。例如,编辑器可以参考当前画布主题、预设背景色或图片主色,选择 .light 或 .dark。下面的代码展示如何将状态连接到工具栏;颜色判断逻辑需要根据应用的实际内容实现:
func updateToolbarScheme(for backgroundIsDark: Bool) {
toolbarScheme = backgroundIsDark ? .light : .dark
}
传给 .toolbarColorScheme 的方案应与背景保持足够的对比度。内容持续变化时,可以在内容状态更新后重新计算并设置方案。系统不会自动根据窗口下方的图像推断合适的标题颜色。
需要留意
.ultraThinMaterial 会呈现系统材质效果,具体外观受窗口内容和系统外观影响。它本身不等同于 Icon Composer 的完整界面实现。SwiftUI 公开的工具栏修饰符可以控制背景和颜色方案,但仅凭这些修饰符无法确认 Icon Composer 内部采用了哪种实现。要复现更细致的布局或自定义标题栏行为,还需要结合应用自身的视图结构实现。
备注:内容仅供参考。
