How display a NSVisualEffectView with with rounded corners in OS X?
My code to add my NSVisualEffectView:
let visualEffectView = NSVisualEffectView(frame: NSMakeRect(0, 0, 300, 300))
visualEffectView.material = NSVisualEffectMaterial.Dark
visualEffectView.blendingMode = NSVisualEffectBlendingMode.BehindWindow
self.addSubview(visualEffectView)
You can enable layer backed views for your NSVisualEffectView
by setting wantsLayer
to true
and then set the cornerRadius
of the backing layer:
let visualEffectView = NSVisualEffectView(frame: NSMakeRect(0, 0, 300, 300))
visualEffectView.material = NSVisualEffectMaterial.Dark
visualEffectView.blendingMode = NSVisualEffectBlendingMode.BehindWindow
visualEffectView.wantsLayer = true
visualEffectView.layer?.cornerRadius = 15.0
self.view.addSubview(visualEffectView)
This results in a effect view with nice rounded corners:
NSVisualEffectView
has a maskImage
property which you can use to clip the view to an arbitrary shape.
From the header:
/* The mask image masks this view. It is best to set this to the
smallest mask image possible and properly set the image.capInsets to
inform the image on how to stretch the contents when it is used as a
mask. Setting the maskImage on an NSVisualEffectView that is the
window.contentView will correctly set the window's shadow.
*/
public var maskImage: NSImage?
For example, you can use an NSImage
with rounded corners and set its capInsets
to the corner radius and its resizingMode
to .stretch
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With