4

I know it's possible to create transparent windows in Cocoa, although is it possible to blur whatever is behind it? I know there's been similar questions, but they deal more blurring what is within the actual NSView, not what is behind it. Is this even possible, and If so what method would I need to look into?

Possible Impossible?

Possible                      Impossible?
Community
  • 1
  • 1
user68332
  • 49
  • 1
  • 4

3 Answers3

2

In order to answer you, yes its Possible.

If you want that effect, check out this GitHub Project I created. I subclassed NSWindow in order to disable opacity and then I added a Background Filter:Gaussian Blur to the NSView using the View Effects Inspector located at the Xcode Utilities Side Bar (you can change the radius value for more or less blur effect).

If you want the new Yosemite View effect, check out the new class they released NSVisualEffectView, just subclass the NSView you want to use this effect.

Hope you find my answer useful.

Best regards,

  • 2
    When I ran your project I just got a view containing a radial gradient from opaque gray to transparent gray? Not seeing any blur anywhere. – BonzaiThePenguin Nov 21 '14 at 02:38
  • You are probably missing some library I don't know which Xcode you are running. Either way you can see the project and analyze what I did – rageofflames Dec 04 '14 at 15:26
  • This Github project is very strange. You can disable opacity with a simple `[self.window setOpaque:NO];`, and you can set the background color to clear with `[self.window setBackgroundColor:[NSColor clearColor]];`. Then, adding a Gaussian Blur as a background filter won't use the behind window graphics to create diffusion/vibrancy like NSVisualEffectView will. – Volomike Dec 31 '15 at 02:15
  • What is strange about it? Couldn't really understand what it was from what you wrote... – rageofflames Dec 31 '15 at 20:55
  • What's strange is that I don't quite understand why you had to subclass -- it can be achieved without subclassing. Also, it puts a white blur ball on top of content, rather than doing the Apple Yosemite Vibrancy effect that takes the background content behind the window and blurs it into the window. See, I had [this question](http://stackoverflow.com/a/34525808/105539) and learned how to make some parts of my window transparent (like a sidebar), but was frustrated because I have to support 10.8 and up, and can't use Yosemite Vibrancy like I wanted. – Volomike Jan 04 '16 at 21:50
  • So, first of all, I was not trying to achieve the Yosemite Vibrancy since it uses multiple effects not only blur, I don't know how many effects they used or which and I have not tried to achieve the same effect, I was just trying to get something similar to the pictures of the question. Second, since I used a Gaussian Blur, which is a radial blur, it will result in a more intense blur in the center getting smoother towards the edges, therefor the white blur ball in the middle, you can try others to see if the outcome is what you are looking for. The subclassing is simply for code division. – rageofflames Jan 05 '16 at 10:50
2

My contribution as I wanted to set the radius and the color.

Doing it in a custom view to blur what is behind. HTH

view.wantsLayer = true
view.layerUsesCoreImageFilters = true
view.layer?.backgroundColor = NSColor(red: 0.2, green: 0.2, blue: 0.2, alpha: 0.5).CGColor

let blurFilter = CIFilter(name: "CIGaussianBlur")
blurFilter?.setDefaults()
blurFilter?.setValue(2.5, forKey: kCIInputRadiusKey)
view.layer?.backgroundFilters?.append(blurFilter!)
Tunaki
  • 132,869
  • 46
  • 340
  • 423
pm200107
  • 303
  • 1
  • 11
1

As of 2021, instead of applying a CIFilters and increasing your APP size by at least 60MB for the blur effect you just use NSVisualEffectView in exchange for your NSView. Choose the reference to blur onto and set the material you think it posses for, so an appropriate color or window background is chosen the blurring will be based on.

NSVisualEffectView *viewWithFX = [[NSVisualEffectView alloc] initWithFrame:NSMakeRect(0, 0, frameRect.size.width, 100)];
viewWithFX.autoresizingMask = NSViewWidthSizable | NSViewMinXMargin | NSViewMaxXMargin;
viewWithFX.translatesAutoresizingMaskIntoConstraints = YES;
viewWithFX.material = NSVisualEffectMaterialSidebar; // or NSVisualEffectMaterialMenu, or ..
viewWithFX.blendingMode = NSVisualEffectBlendingModeBehindWindow; //NSVisualEffectBlendingModeWithinWindow
[viewWithFX addSubview:<#subviews-will-not-have-fx-applied#>];

[self.view addSubview:viewWithFx];

This has the advantage that you don't need layers and it's faster than CIFilters. PS: this will increase your App size by around 8..12MB.

Ol Sen
  • 3,163
  • 2
  • 21
  • 30