swiftui-mac | Sample app to accompany article | Learning library

Figured it out! Without any hacks too thankfully lol

In order to achieve this look without the nasty artifacts in the question you have to do a few things the way macOS wants them.

1. Don't set your NSWindow.backgroundColor = .clear!
This is the cause for the nasty artifacts above in the first place! Leaving your window's color as is will make sure the window functions properly when changing screens. NSVisualEffectView captures the image behind the window and uses that for the background so there's no need to make anything transparent.

2. Make sure to include .titled in the window's styleMask!
Failure to do so will render the window without rounded corners. If you attempt to add rounded corners (like I did) to the SwiftUI view you will still have an opaque background on the NSWindow itself. If you then set your window's background color to .clear (like I did again) the shadow chop issues will ensue! However, this does not mean that the title bar will get in the way, it won't, we'll get to that in a bit.

3. Add your NSVisualEffectView to your SwiftUI view!
I found this to be easier than adding the visual effect to the NSWindow.contentView as a subview.

1. So start off by setting up your NSWindow and AppDelegate! ⤵︎
All you're doing is making sure the titlebar is present but hidden.