macOS用户界面外观风格NSAppearance
macOS用户界面外观风格NSAppearance

macOS用户界面外观风格NSAppearance

NSAppearance 是 macOS 中用于表示用户界面外观风格(Appearance Style) 的类,比如:

1、浅色模式(Light)。

2、深色模式(Dark)。

3、高对比度(High Contrast)。

4、Vibrant Light / Vibrant Dark(侧边栏等系统样式)。

基本用法

给NSView或NSWindow配置用户界面外观风格:

view.appearance = NSAppearance(named: .aqua) // 手动指定浅色

这里指定NSView的用户界面外观风格为浅色。

还可以使用系统样式名称创建:

let vibrant = NSAppearance(named: NSAppearance.Name("NSAppearanceNameVibrantLight"))

这里的系统样式名称为原始字符串值。

基本属性

在NSView或NSWindow中,可以通过下面两个属性指定视图或窗口的外观。

1、appearance:手动设置的外观(可以为 nil)。

2、effectiveAppearance:系统最终生效的外观(考虑继承链)。

let view = NSView()

// 设置 appearance:手动指定浅色外观
view.appearance = NSAppearance(named: .aqua)

// 查看 appearance:就是你刚设的
print(view.appearance?.name ?? "没有手动设置") // NSAppearanceNameAqua

// effectiveAppearance:生效的外观(通常和你设置的相同,否则继承自父视图)
print(view.effectiveAppearance.name) // NSAppearanceNameAqua

两者区别:

如果手动设置NSView的appearance为红色,那么NSView的appearance和effectiveAppearance都是红色。

如果不手动设置NSView的appearance颜色,那么NSView的appearance为nil,但是effectiveAppearance会遵从系统/上级的传承,例如系统颜色为深色,这里的effectiveAppearance也会显示为深色。

使用场景

NSAppearance 主要用于:

1、控制单个视图或窗口的显示风格。

2、获取当前系统或 App 的外观设置。

3、自定义强制某些控件使用指定外观。

常见系统样式名称

1、.aqua:macOS 默认浅色外观,字符串值“NSAppearanceNameAqua”。

2、.darkAqua:macOS 深色模式,字符串值“NSAppearanceNameDarkAqua”。

3、.vibrantLight:用于浅色侧边栏、工具栏等,字符串值“NSAppearanceNameVibrantLight”。

4、.vibrantDark:用于深色侧边栏、工具栏等,字符串值“NSAppearanceNameVibrantDark”。

5、.highContrastAqua:高对比浅色模式,字符串值“NSAppearanceNameHighContrastAqua”。

6、.highContrastDarkAqua:高对比深色模式,字符串值“NSAppearanceNameHighContrastDarkAqua”。

可以使用Swift常量名 .aqua设置外观风格,也是可以使用原始字符串值“NSAppearanceNameAqua”设置外观风格。

使用示例

1、获取当前NSView视图的外观

let currentAppearance = myView.appearance
print(currentAppearance?.name ?? "默认外观")

2、强制某视图为深色模式

myView.appearance = NSAppearance(named: .darkAqua)

这对调试、强制样式很有用,比如希望按钮不跟随系统自动变暗。

3、检查是否为深色模式

if myView.effectiveAppearance.name == .darkAqua {
    print("深色模式")
}

总结

NSAppearance 是 macOS 控制 UI 颜色风格(浅色、深色、高对比等)的机制,支持每个窗口或控件单独设定,也可获取系统当前外观。

在SwiftUI中,通常使用colorScheme判断用户界面外观风格,使用preferredColorScheme设置外观风格。

   

如果您认为这篇文章给您带来了帮助,您可以在此通过支付宝或者微信打赏网站开发者。

欢迎加入我们的 微信交流群QQ交流群,交流更多精彩内容!
微信交流群二维码 QQ交流群二维码

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注