在MacOS上使用NSWindow展示了多种不同风格的窗口

Swift NSWindow Style Showcase

A showcase of many of the different styles of windows possible with NSWindow on MacOS. In some examples, NSToolbar, and NSVisualEffectView are used. No private API's are used.

To test each style, clone the project, open it in Xcode, uncomment each block of code in WindowController.swift and run. The numbers above each block correspond to each style below.

All code is in WindowController.swift in the windowDidLoad function. You should just be able to place each block inside that function to get the exact same result.

If you have a style to add, please make a pull request.

1. Hide title

Don't show the title text in the titlebar.

复制代码
window?.titleVisibility = .hidden

2. Hide titlebar

Hide the titlebar completely.

复制代码
window?.styleMask.remove(.titled)

3. Vibrant background

Create a vibrant background where whatever is behind the window can be slightly seen. This uses NSVisualEffectView.

复制代码
let visualEffect = NSVisualEffectView()
visualEffect.blendingMode = .behindWindow
visualEffect.state = .active
visualEffect.material = .dark
window?.contentView = visualEffect

visualEffect.material can take multiple values including:

  • .appearanceBased: based on the views appearance
  • .dark: dark appearance
  • .ultraDark: ultra dark appearance
  • .light: light appearance
  • .mediumLight: medium light appearance
  • others such as .menu, .popover, .selection, .sidebar and .titlebar

4. Vibrant background with transparent titlebar

Same as above, with a transparent titlebar.

复制代码
let visualEffect = NSVisualEffectView()
visualEffect.blendingMode = .behindWindow
visualEffect.state = .active
visualEffect.material = .dark
window?.contentView = visualEffect

window?.titlebarAppearsTransparent = true
window?.styleMask.insert(.fullSizeContentView)

5. Vibrant background without titlebar

Same as above, without the titlebar.

复制代码
let visualEffect = NSVisualEffectView()
visualEffect.blendingMode = .behindWindow
visualEffect.state = .active
visualEffect.material = .dark
window?.contentView = visualEffect

window?.styleMask.remove(.titled)
window?.isMovableByWindowBackground = true

6. Vibrant background with border radius and no titlebar

A vibrant window with a custom border radius. The border radius value can be changed at visualEffect.layer?.cornerRadius = 16.0.

复制代码
let visualEffect = NSVisualEffectView()
visualEffect.translatesAutoresizingMaskIntoConstraints = false
visualEffect.material = .dark
visualEffect.state = .active
visualEffect.wantsLayer = true
visualEffect.layer?.cornerRadius = 16.0

window?.titleVisibility = .hidden
window?.styleMask.remove(.titled)
window?.backgroundColor = .clear
window?.isMovableByWindowBackground = true

window?.contentView?.addSubview(visualEffect)

guard let constraints = window?.contentView else {
  return
}

visualEffect.leadingAnchor.constraint(equalTo: constraints.leadingAnchor).isActive = true
visualEffect.trailingAnchor.constraint(equalTo: constraints.trailingAnchor).isActive = true
visualEffect.topAnchor.constraint(equalTo: constraints.topAnchor).isActive = true
visualEffect.bottomAnchor.constraint(equalTo: constraints.bottomAnchor).isActive = true

7. Transparent titlebar

A window with a transparent titlebar.

复制代码
window?.titlebarAppearsTransparent = true

8. Transparent titlebar with background color

Same as above with a background color.

复制代码
window?.titlebarAppearsTransparent = true
window?.backgroundColor = .red

9. Toolbar

A window with a toolbar.

复制代码
let customToolbar = NSToolbar()
window?.titleVisibility = .hidden
window?.toolbar = customToolbar

10. Transparent toolbar

Same as above, with the toolbar transparent.

复制代码
let customToolbar = NSToolbar()
window?.titlebarAppearsTransparent = true
window?.titleVisibility = .hidden
window?.toolbar = customToolbar

11. Transparent toolbar without seperator

Same as above, without the toolbar seperator.

复制代码
let customToolbar = NSToolbar()
customToolbar.showsBaselineSeparator = false
window?.titlebarAppearsTransparent = true
window?.titleVisibility = .hidden
window?.toolbar = customToolbar

12. Transparent toolbar with background color and without seperator

Same as above, with a background color.

复制代码
let customToolbar = NSToolbar()
customToolbar.showsBaselineSeparator = false
window?.titlebarAppearsTransparent = true
window?.titleVisibility = .hidden
window?.backgroundColor = .red
window?.toolbar = customToolbar

13. Translucent toolbar

A translucent toolbar allowing for content behind the toolbar to be slightly seen.

复制代码
let customToolbar = NSToolbar()
window?.titleVisibility = .hidden
window?.styleMask.insert(.fullSizeContentView)
window?.contentView?.wantsLayer = true
window?.contentView?.layer?.contents = NSImage(named: NSImage.Name("Background"))
window?.toolbar = customToolbar

14. Translucent titlebar

Same as above with a titlebar instead of a toolbar.

复制代码
window?.titleVisibility = .hidden
window?.styleMask.insert(.fullSizeContentView)
window?.contentView?.wantsLayer = true
window?.contentView?.layer?.contents = NSImage(named: NSImage.Name("Background"))

15. Transparent titlebar without title

Same as above with a transparent titlebar.

复制代码
window?.titleVisibility = .hidden
window?.styleMask.insert(.fullSizeContentView)
window?.titlebarAppearsTransparent = true
window?.contentView?.wantsLayer = true
window?.contentView?.layer?.contents = NSImage(named: NSImage.Name("Background"))

16. macOS Mojave dark mode

The macOS Mojave dark mode appearance.

复制代码
if #available(OSX 10.14, *) {
  window?.appearance = NSAppearance(named: .darkAqua)
}
相关推荐
SoraLuna8 小时前
「Mac畅玩鸿蒙与硬件28」UI互动应用篇5 - 滑动选择器实现
macos·ui·harmonyos
追风林8 小时前
mac 本地docker-mysql主从复制部署
mysql·macos·docker
yqcoder8 小时前
mac 安装 nodemon
macos
一ge科研小菜鸡8 小时前
macOS开发环境配置与应用开发(详细讲解)
macos
hairenjing11238 小时前
使用 Mac 数据恢复从 iPhoto 图库中恢复照片
windows·stm32·嵌入式硬件·macos·word
zorchp15 小时前
在 MacOS 上跑 kaldi
macos·kaldi
德育处主任15 小时前
Mac和安卓手机互传文件(ADB)
android·macos
土小帽软件测试16 小时前
jmeter基础01-2_环境准备-Mac系统安装jdk
java·测试工具·jmeter·macos·软件测试学习
小沈同学呀18 小时前
Mac M1 Docker创建Rocketmq集群并接入Springboot项目
macos·docker·java-rocketmq·springboot
Mac分享吧1 天前
Bartender 5 for Mac 菜单栏管理软件 安装教程【保姆级教程,操作简单小白轻松上手使用】
macos·苹果电脑·菜单栏管理·软件分享·操作系统工具·系统软件管理·bartender