Convert Figma logo to code with AI

lukakerr logoNSWindowStyles

A showcase of the many different styles of windows possible with NSWindow on macOS

1,122
40
1,122
2

Top Related Projects

25,585

Move and resize windows on macOS with keyboard shortcuts and snap areas

14,622

Automatic tiling window manager for macOS à la xmonad.

23,088

A tiling window manager for macOS based on binary space partitioning

Staggeringly powerful macOS desktop automation with Lua

4,361

A lightweight macOS window and app manager scriptable with JavaScript

5,530

Managing windows size and position in OSX

Quick Overview

NSWindowStyles is a showcase of different macOS window styles and customizations using Swift and AppKit. It demonstrates various window appearances, behaviors, and configurations that developers can implement in their macOS applications.

Pros

  • Comprehensive collection of window styles and customizations
  • Provides practical, ready-to-use code examples
  • Helps developers understand and implement native macOS window features
  • Regularly updated to include new styles and features

Cons

  • Limited to macOS development only
  • Requires knowledge of Swift and AppKit
  • Some advanced customizations may not be suitable for all types of applications
  • Documentation could be more extensive for complex implementations

Code Examples

  1. Creating a transparent window:
let window = NSWindow(
    contentRect: NSRect(x: 100, y: 100, width: 300, height: 200),
    styleMask: [.titled, .closable, .miniaturizable, .resizable],
    backing: .buffered,
    defer: false
)
window.isOpaque = false
window.backgroundColor = NSColor.clear
  1. Implementing a borderless window:
let window = NSWindow(
    contentRect: NSRect(x: 100, y: 100, width: 300, height: 200),
    styleMask: [.borderless],
    backing: .buffered,
    defer: false
)
window.isMovableByWindowBackground = true
  1. Creating a sheet window:
let sheetWindow = NSWindow(
    contentRect: NSRect(x: 0, y: 0, width: 300, height: 200),
    styleMask: [.titled, .closable],
    backing: .buffered,
    defer: false
)

parentWindow.beginSheet(sheetWindow) { response in
    // Handle sheet dismissal
}

Getting Started

To use NSWindowStyles in your project:

  1. Clone the repository:

    git clone https://github.com/lukakerr/NSWindowStyles.git
    
  2. Open the Xcode project file.

  3. Explore the different window styles in the source code.

  4. Copy the relevant code snippets into your own project and customize as needed.

  5. Ensure you have the necessary imports:

    import Cocoa
    
  6. Implement the desired window style in your application's window controller or view controller.

Competitor Comparisons

25,585

Move and resize windows on macOS with keyboard shortcuts and snap areas

Pros of Rectangle

  • Active development with frequent updates and bug fixes
  • Offers more advanced window management features like snap areas and keyboard shortcuts
  • Cross-platform support (macOS and Windows)

Cons of Rectangle

  • Larger codebase and potentially more complex to contribute to
  • May have a steeper learning curve for users due to more features

Code Comparison

Rectangle (Swift):

func snapWindowToEdge(_ edge: Edge) {
    guard let screen = window.screen else { return }
    let frame = calculateFrameForEdge(edge, on: screen)
    window.setFrame(frame, display: true, animate: true)
}

NSWindowStyles (Objective-C):

- (void)setWindowStyle:(NSWindowStyleMask)styleMask {
    [self.window setStyleMask:styleMask];
    [self.window makeKeyAndOrderFront:nil];
}

Key Differences

  • Rectangle focuses on window management and positioning
  • NSWindowStyles primarily demonstrates various macOS window styles
  • Rectangle is more feature-rich and actively maintained
  • NSWindowStyles serves as a simpler, educational resource for macOS window styling

Use Cases

  • Rectangle: Users needing advanced window management on macOS or Windows
  • NSWindowStyles: Developers learning about macOS window styling options

Community and Support

  • Rectangle has a larger community and more frequent updates
  • NSWindowStyles is a smaller project with less active development
14,622

Automatic tiling window manager for macOS à la xmonad.

Pros of Amethyst

  • Actively maintained with regular updates and bug fixes
  • Offers advanced window management features like tiling and hotkey customization
  • Supports multiple monitors and spaces

Cons of Amethyst

  • Steeper learning curve due to more complex functionality
  • May consume more system resources due to its extensive features
  • Requires more setup and configuration to fully utilize its capabilities

Code Comparison

Amethyst (Swift):

let layouts: [Layout] = [
    TallLayout(),
    WideLayout(),
    FullscreenLayout(),
    ColumnLayout()
]

NSWindowStyles (Swift):

let window = NSWindow(contentRect: .zero, styleMask: [.titled, .closable, .miniaturizable, .resizable], backing: .buffered, defer: false)
window.titlebarAppearsTransparent = true
window.titleVisibility = .hidden

Summary

Amethyst is a more feature-rich window management tool, offering tiling and advanced customization options. It's actively maintained but may require more setup and resources. NSWindowStyles, on the other hand, focuses on demonstrating various window styles and is simpler to use, but has more limited functionality. The choice between them depends on whether you need advanced window management features or just want to explore different window styles in macOS applications.

23,088

A tiling window manager for macOS based on binary space partitioning

Pros of yabai

  • Offers advanced window management and tiling capabilities
  • Provides extensive customization options through scripting
  • Actively maintained with regular updates and improvements

Cons of yabai

  • Steeper learning curve due to its complexity
  • Requires disabling System Integrity Protection (SIP) for full functionality
  • May have compatibility issues with some macOS versions or applications

Code comparison

NSWindowStyles:

let window = NSWindow(contentRect: NSRect(x: 100, y: 100, width: 300, height: 200),
                      styleMask: [.titled, .closable, .miniaturizable, .resizable],
                      backing: .buffered,
                      defer: false)

yabai:

yabai -m config layout bsp
yabai -m config top_padding 10
yabai -m config left_padding 10
yabai -m config right_padding 10
yabai -m config bottom_padding 10

Summary

NSWindowStyles is a simpler, more focused project that demonstrates various window styles in macOS using Swift. It's ideal for developers looking to understand and implement different window appearances in their applications.

yabai, on the other hand, is a comprehensive window management tool that offers advanced tiling and scripting capabilities. It's better suited for power users who want to customize their macOS window management experience extensively.

While NSWindowStyles is primarily a demonstration project, yabai is a full-fledged application with ongoing development and a dedicated user base.

Staggeringly powerful macOS desktop automation with Lua

Pros of Hammerspoon

  • More comprehensive functionality for macOS automation and window management
  • Actively maintained with regular updates and a larger community
  • Extensible through Lua scripting, allowing for custom solutions

Cons of Hammerspoon

  • Steeper learning curve due to its broader scope and Lua scripting
  • Larger codebase and resource footprint

Code Comparison

NSWindowStyles:

let window = NSWindow(contentRect: .zero, styleMask: [.titled, .closable, .miniaturizable, .resizable], backing: .buffered, defer: false)
window.titlebarAppearsTransparent = true
window.titleVisibility = .hidden

Hammerspoon:

local window = hs.window.focusedWindow()
window:setFullScreen(true)
window:moveToUnit(hs.layout.right50)

Summary

NSWindowStyles focuses specifically on macOS window styling options, providing a straightforward way to customize window appearances. Hammerspoon, on the other hand, offers a more comprehensive toolkit for macOS automation, including window management, hotkeys, and system interactions. While NSWindowStyles is simpler to use for its specific purpose, Hammerspoon provides greater flexibility and power at the cost of increased complexity.

4,361

A lightweight macOS window and app manager scriptable with JavaScript

Pros of Phoenix

  • More comprehensive window management functionality
  • Actively maintained with regular updates
  • Extensible through JavaScript plugins

Cons of Phoenix

  • Steeper learning curve due to configuration complexity
  • Requires JavaScript knowledge for advanced customization
  • Larger codebase and resource footprint

Code Comparison

NSWindowStyles:

let window = NSWindow(contentRect: NSRect(x: 100, y: 100, width: 300, height: 200),
                      styleMask: [.titled, .closable, .miniaturizable, .resizable],
                      backing: .buffered,
                      defer: false)

Phoenix:

const window = Window.focused();
window.setFrame({
  x: 100,
  y: 100,
  width: 300,
  height: 200
});

Summary

NSWindowStyles focuses on demonstrating various macOS window styles and configurations, making it ideal for developers looking to understand and implement specific window appearances. Phoenix, on the other hand, offers a more robust window management solution with extensive customization options through JavaScript. While NSWindowStyles provides a straightforward approach to window styling, Phoenix allows for complex window arrangements and automation at the cost of a steeper learning curve.

5,530

Managing windows size and position in OSX

Pros of ShiftIt

  • Actively maintained with recent updates
  • Provides window management functionality for macOS
  • Offers keyboard shortcuts for resizing and moving windows

Cons of ShiftIt

  • Limited to window management features
  • Less focus on customizing window appearance

Code Comparison

NSWindowStyles:

let window = NSWindow(
    contentRect: NSRect(x: 100, y: 100, width: 300, height: 200),
    styleMask: [.titled, .closable, .miniaturizable, .resizable],
    backing: .buffered,
    defer: false
)

ShiftIt:

- (void)moveWindowToLeftHalf {
    AXUIElementRef app = [self frontmostApplication];
    AXUIElementRef window = [self frontmostWindow:app];
    [self moveWindow:window toRect:[self leftHalfRect]];
}

Summary

NSWindowStyles focuses on demonstrating various window styles and appearances in macOS applications, providing a comprehensive showcase of different window configurations. On the other hand, ShiftIt is a practical tool for window management, offering keyboard shortcuts and functions to resize and reposition windows efficiently. While NSWindowStyles is more of a reference for developers working on window customization, ShiftIt is an end-user application for improving productivity through better window organization.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Swift NSWindow Style Showcase

Swift 5 Platform Github

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 custom 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. Vibrant background with transparent titlebar and no window controls

A vibrant window with a standard border radius and no window controls or title.

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

window?.styleMask.insert(.titled)

window?.titlebarAppearsTransparent = true
window?.titleVisibility = .hidden

window?.standardWindowButton(.miniaturizeButton)?.isHidden = true
window?.standardWindowButton(.closeButton)?.isHidden = true
window?.standardWindowButton(.zoomButton)?.isHidden = true

window?.isMovableByWindowBackground = true

8. Transparent titlebar

A window with a transparent titlebar.

window?.titlebarAppearsTransparent = true

9. Transparent titlebar with background color

Same as above with a background color.

window?.titlebarAppearsTransparent = true
window?.backgroundColor = .red

10. Toolbar

A window with a toolbar.

let customToolbar = NSToolbar()
window?.titleVisibility = .hidden
window?.toolbar = customToolbar

11. Transparent toolbar

Same as above, with the toolbar transparent.

let customToolbar = NSToolbar()
window?.titlebarAppearsTransparent = true
window?.titleVisibility = .hidden
window?.toolbar = customToolbar

12. 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

13. 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

14. 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

15. 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"))

16. 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"))

17. macOS Mojave dark mode

The macOS Mojave dark mode appearance.

if #available(OSX 10.14, *) {
  window?.appearance = NSAppearance(named: .darkAqua)
}