Friday, May 15, 2009

F-Script - an essential tool for cocoa developers

I've read about F-Script at least 5 times before I actually decided to give it a try. What convinced me is that every one who had the opportunity to see it in action seemed to be under a big impression. Soon enough the time came for me to be under impression too.

It was so easy to set up I started playing around with it in a matter of minutes. The possibilities are pretty much endless. Think about it as programming (and debugging) objective-c applications dynamically during runtime. You can tinker around with your controls, see what data you're storing without having to use a debugger, check your bindings and core data objects.



I'd like this post to encourage you to give F-Script a try. In order to achieve this I'll tell you how to set everything up and how to start using F-Script from within the application you are developing. This shouldn't take more than 5 minutes.

1) Step 1 - Download F-Script from www.fscript.org
2) Install the F-Script interface builder plugin

Go into the F-Script folder you downloaded and copy FScriptIBPlugin.ibplugin to /Developer/Platforms/MacOSX.platform/Developer/Library/Interface Builder/Plug-ins/

3) Open your XCode project and add FScript.framework to the project frameworks.




Locate the framework and click "Add".

4) Set up your project to copy the FScript.framework to the target when compiling.


Choose the target and from the context menu choose "New Copy Files Build Phase". This will create a new build phase which will always copy the files you specify when building the project.


From the "Destination" popup menu choose "Frameworks" and close the window.


Position the new build phase just below the "Copy Bundle Resources" phase (although to tell you the truth I haven't ever really checked if order is important, I just assume it is as it doesn't hurt), rename it to "Copy Frameworks" and drag the FScript.framework file you previously added to your projects frameworks to the new build phase.

5) Open MainMenu.nib (or .xib) and drag the FScript menu control from the control library to your menu.


Locate the FScript menu item in the Interface Builder library palette.


Drag and drop it to the main menu of your application.

6) Build and Run your application. From the main menu choose F-Script -> Object browser. A new window will open. Click "Select view" and click on a view which properties you wish to observe. Enjoy!

Monday, May 11, 2009

Binding NSArrayControllers arrangedObjects to custom NSView

Some functionality in cocoa is taken for granted. It's sooo easy to create something that works - drag here, drop there, bind, bind, presto! Some time during your adventure with cocoa you might start wondering how some of these mechanisms work. I did :) When that moment comes, don't back down. Instead, try pursuing the idea. It's a great time to delve deeper into cocoa and objective-c and see how apple engineers solved issues you might have been implementing wierd workarounds for.


I like the way some people write about cocoa's bindings - "It's magic". It sure does seem so for some one who knows nothing about them (or knows a whole bunch and doesn't feel like explaining). The truth is bindings are nothing more than an automated form of KVO (Key-Value Observing). Binding an object to another object results in those objects being in sync. We can do the exact same thing by observing those objects and manually updating their values, but in such a case we would end up writing a lot of our own glue code.


Recently I've created a custom NSView that essentially mimicked the way NSTableView worked. I didn't want to subclass NSTableView mainly because it seems to have been designed to work well when inside an NSScrollView, not as an independent view. Seeing as how NSTableView had a content property you could bind to I created an NSMutableArray object called content in my class and made it KVO compliant. This is where the problems started. Simply binding content to my NSArrayControllers arrangedObjects array wasn't going to inform my custom view about the changes that were being made to arrangedObjects. I figured I could overcome this by observing arrangedObjects. Unfortunately, it turns out that key-value observing for collections isn't fully functional. Apples documentation for:



- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context;


states that:


NSKeyValueChangeKindKey

An NSNumber object that contains a value corresponding to one of the NSKeyValueChangeKindKey enumerations, indicating what sort of change has occurred.

A value of NSKeyValueChangeSetting indicates that the observed object has received a setValue:forKey: message, or that the key-value-coding-compliant set method for the key has been invoked, or that willChangeValueForKey:/didChangeValueForKey: has otherwise been invoked.

A value of NSKeyValueChangeInsertionNSKeyValueChangeRemoval, or NSKeyValueChangeReplacement indicates that mutating messages have been sent to the array returned by amutableArrayValueForKey: message sent to the object, or that one of the key-value-coding-compliant array mutation methods for the key has been invoked, or thatwillChange:valuesAtIndexes:forKey:/didChange:valuesAtIndexes:forKey: has otherwise been invoked.

You can use NSNumber's intValue method to retrieve the integer value of the change kind.

Available in Mac OS X v10.3 and later.

Declared in NSKeyValueObserving.h.

NSKeyValueChangeNewKey

If the value of the NSKeyValueChangeKindKey entry is NSKeyValueChangeSetting, and NSKeyValueObservingOptionNew was specified when the observer was registered, the value of this key is the new value for the attribute.

For NSKeyValueChangeInsertion or NSKeyValueChangeReplacement, if NSKeyValueObservingOptionNew was specified when the observer was registered, the value for this key is an NSArray instance that contains the objects that have been inserted or replaced other objects, respectively.

Available in Mac OS X v10.3 and later.

Declared in NSKeyValueObserving.h.


If this were true, I wouldn't be writing this post :) If the value of NSKeyValueChangeKindKey for the change dictionary contains NSKeyValueChangeInsertion, NSKeyValueChangeRemoval or NSKeyValueChangeReplacement the value for NSKeyValueChangeNewKey will always be [NSNull null]. From what I've read, this is something Apple is aware of, but hasn't established a date for when it will be fixed (this could mean that it will never get fixed).


What this implied for my custom view is the fact that I needed to establish what the changes were myself. However, if I bind content to arrangedObjects and observe arrangedObjects the value of both will always be the same once my code in the observing method is reached. This in turn implies that I will not be able to get the changes and that bindings will not be a feasible solution for this problem. I started wondering how Apple solved this issue. What I came up with is a solution that perfectly mimics NSTableViews behaviour.


I came to terms with the fact that I won't be able to use bindings, but I really wanted the illusion of bindings to stay. I decided to overwrite the method used for binding like so:


- (void)bind:(NSString *)binding toObject:(id)observableController withKeyPath:(NSString *)keyPath options:(NSDictionary *)options
{
if([binding isEqualToString:@"content"] && [keyPath isEqualToString:@"arrangedObjects"] && [observableController isKindOfClass:[NSArrayController class]])
{
[observableController addObserver:self forKeyPath:keyPath options:(NSKeyValueObservingOptionNew | NSKeyValueObservingOptionOld) context:nil];
_contentArrayController = observableController;
[self setContent: [_contentArrayController arrangedObjects]];
}
else
[super bind:binding toObject:observableController withKeyPath:keyPath options:options];
}


From the outside this still looks like the normal binding procedure is taking place, when in reality it's only observing. I also assigned my NSArrayController to a class variable in my custom view called _contentArrayController. This becomes useful in the unbind method:


- (void)unbind:(NSString*)keyPath
{
if([keyPath isEqualToString:@"content"])
{
if(_contentArrayController != nil)
{
[_contentArrayController removeObserver:self forKeyPath:@"arrangedObjects"];
_contentArrayController = nil;
}
}

[super unbind:keyPath];
}


Once all that is done you can try to observe changes in the observeValueForKeyPath method. What you will notice is that there is another issue - the only value the change dictionary will return for the NSKeyValueChangeKindKey is NSKeyValueChangeSetting. This is due to the way the arrangedObjects array is set in NSArrayController. So what we are left with is determining changes ourselves. If you need a custom view that displays a small amount of data then you might as well just set the new value for your views content based on what arrangedObjects contains. If you NEED to know what changed then I guess the reasonable way to go about it would be to compare your views current content array with the new arrangedObjects array like so:


- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
if([keyPath isEqualToString:@"arrangedObjects"] && _contentArrayController != nil)
{
NSMutableArray *array = [_contentArrayController arrangedObjects];

if(array != nil)
{
if([array count] > [content count])
{
NSLog(@"items added");
}
else if([array count] < [content count])    {     NSLog(@"items removed");    }    else if([array count] == [content count])    {     NSLog(@"items replaces");    }   }                 //don't forget to set the content array!!!   [self setContent:array];   [self setNeedsDisplay:YES];  } } 

The problem with this is that if you assign a completely new array to NSArrayControllers content the above code won't be worth a damn. You could ofcourse go through every object in the array every time arrangedObject changes, but for large amounts of data that seems like a bad use of resources.

Anyhow, I encourage readers to look for interesting solutions to fun problems.

Wednesday, April 22, 2009

PDF with paging

In my previous post I wrote about how to render the contents of an NSView to a pdf. That method was simple and intuitive. However, it had 1 drawback. It didn't allow me to create paginated PDF's. The way you go about this is much less intuitive and requires you use the NSPrintOperation class. Basically, what you want to do is print to a PDF. You start by creating an NSPrintInfo object using the default printing preferences:


//this will point to our NSPrintInfo object
NSPrintInfo *printInfo;
//this will point to the default printer info object
NSPrintInfo *sharedInfo;
//thi will point to our settings for the NSPrintInfo object
NSMutableDictionary *printInfoDict;
//this will point to the settings for the default NSPrintInfo object
NSMutableDictionary *sharedDict;

sharedInfo = [NSPrintInfo sharedPrintInfo];
sharedDict = [sharedInfo dictionary];
printInfoDict = [NSMutableDictionary dictionaryWithDictionary:
sharedDict];

//below we set the type of printing job to a save job.
[printInfoDict setObject:NSPrintSaveJob 
forKey:NSPrintJobDisposition];

//set the path to the file you want to print to
[printInfoDict setObject:@"/Users/OnCocoa/Desktop/test.pdf" forKey:NSPrintSavePath];

//create our very own NSPrintInfo object with the settings we specified in printInfoDict
printInfo = [[[NSPrintInfo alloc] initWithDictionary: printInfoDict] autorelease];


Once you set up your NSPrintInfo object you have to create an NSPrintOperation object, specifying which view you want to print from and which NSPrintInfo object you want to use.


//create the NSPrintOperation object, specifying docView from the previous post as the NSView to print from.
NSPrintOperation *printOp = [NSPrintOperation printOperationWithView:docView printInfo:printInfo];

//we don't want to show the printing panel
[printOp setShowPanels:NO];

//run the print operation
[printOp runOperation];


Thats all you need to do to print a view to a PDF with paging the vanilla way. If you want to print like Safari does, you have to set up the margins appropriately using the code below:


[printInfo setHorizontalPagination: NSFitPagination];
[printInfo setVerticallyCentered:NO];
[printInfo setHorizontallyCentered:NO];

NSRect imageableBounds = [printInfo imageablePageBounds];
NSSize paperSize = [printInfo paperSize];
if (NSWidth(imageableBounds) > paperSize.width) {
imageableBounds.origin.x = 0;
imageableBounds.size.width = paperSize.width;
}
if (NSHeight(imageableBounds) > paperSize.height) {
imageableBounds.origin.y = 0;
imageableBounds.size.height = paperSize.height;
}

[printInfo setBottomMargin:NSMinY(imageableBounds)];
[printInfo setTopMargin:paperSize.height - NSMinY(imageableBounds) - NSHeight(imageableBounds)];
[printInfo setLeftMargin:NSMinX(imageableBounds)];
[printInfo setRightMargin:paperSize.width - NSMinX(imageableBounds) - NSWidth(imageableBounds)];


One more thing to keep in mind is that if you are generating a PDF from HTML using a WebView (like in my previous post) you have to wait for the contents of the WebView to render. It doesn't matter if you are loading from disk or from the net, you should always set a frame delegate using WebViews -(void)setFrameLoadDelegate:(id)delegate and respond to:


- (void)webView:(WebView *)sender didFinishLoadForFrame:(WebFrame *)frame;


This method will get called once the WebView renders the contents of the page you requested. Check out the screenshot below to see what you can accomplish with all this:




Good luck!

Sunday, April 19, 2009

HTML to PDF using WebKit

Creating a PDF with the contents of any NSView is extremely easy. All you have to do is use NSViews:


- (NSData *)dataWithPDFInsideRect:(NSRect)aRect


When trying to create a PDF from HTML the natural way to go is using the method mentioned above from an instance of WebView. Unfortunately, it turns out there is a small inconvenience. When called from an instance of WebView this method WILL NOT draw everything to PDF. It's very easy to test this without writing any code. Try printing a few pages to PDF in Safari. This is how my blog gets rendered:




It's also interesting that google.pl renders without the google logo, while google.us renders properly:




Anyhow, this issue is very easy to solve in code. Let's say you load your PDF as follows:


//get a pointer to the document view so that we render the entire web page, not just the visible portion.
NSView *docView = [[[webview mainFrame] frameView] documentView];

[docView lockFocus];

//create the PDF
NSData *data = [docView dataWithPDFInsideRect:[docView bounds]];

[docView unlockFocus];

//create an instance of a PDFDocument to display in a PDFView.
PDFDocument *doc = [[PDFDocument alloc] initWithData:data];

//display the PDF document in a PDFView
[pdfview setDocument:doc];

[pdfWindow orderFront:nil];


This will produce the standard results. In order to render everything to PDF you have to set WebViews preferences appropriately. WebView has a method - (void)setPreferences:(WebPreferences*)preferences. If you look at the documentation for WebPreferences you will notice it has a method called - (void)setShouldPrintBackgrounds:(BOOL)pb. Setting this to YES solves the minor inconvenience mentioned in this post.


WebPreferences *preferences = [[[WebPreferences alloc] initWithIdentifier:@"testing"] autorelease];
[preferences setShouldPrintBackgrounds:YES];
[webview setPreferences:preferences];


After setting WebViews preferences to print the backgrounds, my blog and all other pages print just fine to PDF.



UPDATE:

Check out my next post where I mention two important things:
1) How to print to a PDF with paging.
2) How to make sure the WebView loaded all it's content before printing (if you're getting a blank page when printing this is what you need!).

Monday, March 30, 2009

Drawing an NSCell from a flipped NSView to a bitmap context


Recently I found myself in need of a custom drawn list view. It's purpose would be to display 1 column and a bunch of rows, similarly to the way NSTableView does, except my view needed more flexibility in terms of the way it shapes and displays items. I thought about subclassing NSTableView, but after careful consideration I've realized that would be an overkill and went with subclassing NSView instead. To make my control efficient, I used the same approach as Apple did with NSTableView - each row is drawn by the same NSCell instance. This way I didn't have to waste memory creating a corresponding NSCell object for each item in the list views content. This was all fairly basic. I added some simple methods, did a little math and presto - custom control a 'la cocoa.


I came across a small issue when implementing drag and drop and I thought the solution might be of interest to some. My custom list views isFlipped method returns YES. This allows the NSScrollView that owns my control to work intuitively - from top to bottom (it's also much more intuitive for me). I do realize there are other ways of accomplishing this, but this just felt like it required the least hassle. All was fine in Cocoa land until I wanted to draw my NSCells to a bitmap and use it as a drag and drop image. There were two goals I wanted to accomplish:

  • Draw the NSCell into a bitmap context without changing anything in it's drawing method - (void)drawInteriorWithFrame:(NSRect)theCellFrame inView:(NSView *)theControlView
  • Draw a few cells and then arrange them into a nice image suitable for drag and drop. This made it unsuitable for me to use any of the NSViews standard methods for drawing to a bitmap context.


The cell I want to draw to the bitmap context is displayed below:


So the standard way to go about drawing to a bitmap context is:

//creating the rectangle that defines the bounds of our bitmap image
NSRect offscreenRect = NSMakeRect(0.0, 0.0, 100, 20);
NSBitmapImageRep* offscreenRep = nil;

//creating the bitmap image
offscreenRep = [[NSBitmapImageRep alloc] initWithBitmapDataPlanes:nil
pixelsWide:offscreenRect.size.width
pixelsHigh:offscreenRect.size.height
bitsPerSample:8
samplesPerPixel:4
hasAlpha:YES
isPlanar:NO
colorSpaceName:NSCalibratedRGBColorSpace
bitmapFormat:0
bytesPerRow:(4 * offscreenRect.size.width)
bitsPerPixel:32];

[NSGraphicsContext saveGraphicsState];

//setting the current context to a bitmap context
[NSGraphicsContext setCurrentContext:[NSGraphicsContext
graphicsContextWithBitmapImageRep:offscreenRep]];

//do some drawing

[NSGraphicsContext restoreGraphicsState];

//creating an NSImage setting whatever we drew above to be it's representation
NSImage *image = [[[NSImage alloc] init] autorelease];
[image addRepresentation:offscreenRep];

//this allows us to create an image thats content is transparent (see the 'fraction') parameter below
NSImage *dragImage = [[[NSImage alloc] initWithSize:[image size]] autorelease];
[dragImage lockFocus];
[image compositeToPoint:NSMakePoint(0, 0) operation:NSCompositeSourceOver fraction:0.5];
[dragImage unlockFocus];


Unfortunately, this left me with:


If you compare that to the original, you will notice that the text views got switched. This was of course, unacceptable.

I started googling and found a bunch of blogs stating that using an NSAffineTransform would solve the problem. So I added:

NSAffineTransform* xform = [NSAffineTransform transform];
[xform translateXBy:0.0 yBy:offscreenRect.size.height];
[xform scaleXBy:1.0 yBy:-1.0];
[xform concat];


I really hoped this method would work, because it was the only solution that seemed, at the time, reasonable. It produced the image you see below:


This time the text views were in their proper places, but the text was flipped. Having wasted some time trying to find a solution I decided to give my own wacky idea a go. When using a "ported" graphics context one can set the context as flipped. I decided to create a CGContextRef, use it as a ported and flipped NSGraphicsContext and draw to it like so:

//create a CGContextRef so that we can later port it and make it flipped
CGContextRef context = CGBitmapContextCreate (bitmapData,
offscreenRect.size.width,
offscreenRect.size.height,
8,
bitmapBytesPerRow,
colorSpace,
kCGImageAlphaPremultipliedLast);

[NSGraphicsContext saveGraphicsState];
//here we port the context and make it flipped
[NSGraphicsContext setCurrentContext:[NSGraphicsContext graphicsContextWithGraphicsPort:context flipped:YES]];

NSAffineTransform* xform = [NSAffineTransform transform];
[xform translateXBy:0.0 yBy:offscreenRect.size.height];
[xform scaleXBy:1.0 yBy:-1.0];
[xform concat];

//perform drawing

//create a CGImageRef from the CGContextRef
CGImageRef myImage = CGBitmapContextCreateImage (context);

//port the CGImageRef to an NSBitmapImageRep
NSBitmapImageRep* offscreenRep = [[[NSBitmapImageRep alloc] initWithCGImage:myImage] autorelease];

[NSGraphicsContext restoreGraphicsState];

//create the image and set it's representation to what was drawn above
NSImage *image = [[[NSImage alloc] init] autorelease];
[image addRepresentation:offscreenRep];

//this allows us to create an image thats content is transparent (see the 'fraction') parameter below
NSImage *dragImage = [[[NSImage alloc] initWithSize:[image size]] autorelease];
[dragImage lockFocus];
[image compositeToPoint:NSMakePoint(0, 0) operation:NSCompositeSourceOver fraction:0.5];
[dragImage unlockFocus];


As a result I got exactly what I wanted: