Today a simple example of Drag & Drop with Cocoa and NSView. The screenshot below shows two groups. In the first one, you can drop the photos on your filesystem, taken from Desktop or Finder. In the second group, you can only drop the first group image.
You can find the source code here: Drag & Drop Test Source Code.
Following the post of yesterday, today I’ve implemented a simple VBoxView (Vertical Box Layout) that allow you to lines up NSViews vertically.
Cocoa Scrollable NSViews VBox
Today I’m playing a bit with Quartz and Cocoa Drawing system (that is based on Quartz).
I’ve made a simple example that you can see below where I’ve used custom NSView that draws an Image and a Bezier Path with some text inside, and around the Bezier Path there’s a Shadow.
Cocoa Drawing Example
…And this is the drawRect method source code of the custom NSView.
- (void)drawRect:(NSRect)frameRect {
[NSGraphicsContext saveGraphicsState];
[[NSColor colorWithCalibratedRed:0.64 green:0.66 blue:0.71 alpha:1.0] set];
NSRectFill(frameRect);
/* Draw Shadow */
NSShadow *shadow = [[NSShadow alloc] init];
[shadow setShadowColor:[[NSColor blackColor] colorWithAlphaComponent:0.5]];
[shadow setShadowOffset:NSMakeSize(4.0, -4.0)];
[shadow setShadowBlurRadius:3.0];
[shadow set];
/* Draw Control */
NSRect myRect = NSMakeRect(80, 50, frameRect.size.width - 120, 60);
NSBezierPath *path = [NSBezierPath bezierPath];
[path setLineJoinStyle:NSRoundLineJoinStyle];
[path appendBezierPathWithRoundedRect:myRect xRadius:8.0 yRadius:8.0];
[path moveToPoint:NSMakePoint(80, 75)];
[path lineToPoint:NSMakePoint(65, 85)];
[path lineToPoint:NSMakePoint(80, 95)];
NSColor *startingColor = [NSColor colorWithCalibratedRed:0.90
green:0.92 blue:0.85 alpha:1.0];
NSColor *endingColor = [NSColor colorWithCalibratedRed:0.81
green:0.83 blue:0.76 alpha:1.0];
NSGradient *gradient = [[[NSGradient alloc] initWithStartingColor:startingColor
endingColor:endingColor] autorelease];
[path fill];
[gradient drawInBezierPath:path angle:90];
[NSGraphicsContext restoreGraphicsState];
[shadow release];
NSImage *image = [NSImage imageNamed:NSImageNameUser];
[image drawInRect:NSMakeRect(15, 50, 50, 50) fromRect:NSZeroRect
operation:NSCompositeSourceOver fraction:1.0];
NSString *string = [NSString stringWithString:@"Text\nMore Text"];
[string drawInRect:NSMakeRect(90, 60, frameRect.size.width - 140, 45)
withAttributes:nil];
}
This morning I’ve created this FilterBar (take a look at the picture below). You can add custom NSView and you can manage you groups with delegates.
Cocoa Filterbar Demo
Below, I’ve added a movie… but it doesn’t [sizeToFit] the page… so here is the link of Cocoa Filterbar Demo. And here you can find the Cocoa Filterbar Souce.
It’s a couple of days that I’m searching for something like QHBoxLayout (Qt Horizonal Box Layout) in Cocoa. There’s NSMatrix that do something like this… but it uses NSCell and it sets the same size for all the cells, so this is not what I want. My solution is a simple NSView subclass…
Example: Cocoa Horizontal Box
I Really like Apple Mail Note Editor, and today I’ve tried to do something like notes of Mail.app
Mail uses html and css loaded into a WebView (WebKit) to render the background of the window. I’ve used a simple NSView, I’ve Inherited from it and I’ve added a couple of feature to render an image as background pattern. Below you can see the result and here you can Download the Source.
NSWindow with Image Pattern as Background