xcodemacosswiftcocoansvisualeffectview

NSVisualEffectView with rounded corners


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)

Solution

  • 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:

    enter image description here