NSWindow with round corners and shadow

Question

I\'m trying to crate a NSWindow without title bar (NSBorderlessWindowMask) with round corners and a shadow, similar to the below \"Welcome

Answer 1

I just created my own version of the Xcode splash screen for my application, including the recent files list view and all four corners are rounded:

http://www.fizzypopstudios.com/splash.png

The easiest way I found to do this was to create a window using the interface builder. I made the window 800x470 pixles, then I unchecked all the options except "Shadow" and "Restorable". This left me with a blank slate with which to create my splash screen.

In the initWithContentRect:styleMask:backing:defer: method for the splash window I also set the following properties:

self.opaque = NO
self.backgroundColor = [NSColor clearColor]
self.movableByWindowBackground = YES

If you displayed the window at this point you would have no background, and the window shadow would automatically be set to be behind any non-transparent controls in the window.

When I draw my window background I fill the left 500 pixels with light gray and the remaining 300 pixels on the right with white. If displayed the window would have no rounded corners at this point.

I then use [NSColor clearColor] to notch squares out all 4 corners of the window (the size of the square is the radius of the rounded corner we will draw next). Then using Bezier Paths I draw in a rounded corner into the notches I just cut out.

I tried to do this by creating a bezier path that when filled with [NSColor clearColor] would also result in a round corner, however, for some reason the path would not fill with clear, though it would fill with other colors.

Now, if you render the window you will have rounded corners, however, if you drop a table view into the right side of the window the corners will become square again. The easy solution there is to set the NSScrollView to not draw a background, and then to set the nested NSTableView background to transparent.

As we are drawing the background behind the table we don't really need the table or scroll view drawing a background, and this then preserves the rounded corners.

If you have any other controls that go near the 4 corners just keep them indented enough to not be in the rounded area. An example of this is I have a button in the lower left of my window, however, since the button has transparency the rounded corner is not removed.

One other consideration is you may want to provide canBecomeKeyWindow and canBecomeMainWindow methods in your window subclass to return YES as the default for these types of windows is NO.

I hope this info helps you create your window, I saw your question a while ago and thought I would come back and let you know how I created my window in case it could help you! :)