Creating Models

How you define image properties in your models depends on your application—it depends on how you want to store and access the images. If the images are stored on disk or in your project folder on the same computer, then you can access them via a file path. If the images are stored not on disk but on a remote server, then you can access them via a URL. If the images are stored in some data source, then you might load the images directly into memory. If you load them, you might define your image properties as simply NSImage objects. Fortunately, Cocoa bindings supports all these options.

In this example, the model uses an NSImage to represent the image property of a Media object as shown in Figure 2 in Creating a Master-Detail Interface.

In the case of a file path or URL, you typically store only the filename in the model not the absolute path or URL (for example, you don’t want to update your models every time you move the image folder). However, the bindings expect an absolute path or URL. One solution is to implement a custom value transformer that takes an image filename and returns a file path or URL based on some variables you define. See Using a Value Transformer to Convert Paths to modify this example to use file paths instead of NSImage objects.

Creating Views

Next, you create the image views by either dragging an NSImageView to a window or an NSImageCell to the column that will display the images.

Creating Controllers

This example assumes you already have a working master-detail interface. Follow the steps in Creating Controllers in Creating a Master-Detail Interface if you need to create an array controller.

Binding Views to Controllers

Next, you bind the image views to the controllers. A subset of the value bindings of an NSImageView and an NSTableColumn (containing an NSImageCell) to choose from are:

• value—an NSImage object.

• valuePath—an absolute path to the image file.

• valueURL—a URL that returns the image file.

For example, you configure the value binding for the Image table column in Figure 1 as follows:

1. Set Bind to to your array controller object. For example, MediaAssetsController.

2. Set Controller Key to arrangedObjects (the collection of objects being displayed).

3. Set Model Key Path to the NSImage property to display in that column. For example, in the media asset application, set the key path to image.

You configure the value binding for the NSImageView in the detail interface similarly, except that you set the Controller Key value to selection (that is, the currently selected object).

See Using a Value Transformer to Convert Paths for a variation of this example that uses the valuePath binding.

Using a Value Transformer to Convert Paths

If you want to access your images using a file path, then you bind your views to your controllers using the valuePath binding instead. However, valuePath is expected to be an absolute file path. Typically, you do not store absolute paths in your models, just filenames or relative paths. You can convert a filename or relative path to an absolute path using a custom value transformer as follows.

#import "PathTransformer.h"

@implementation PathTransformer

+ (Class)transformedValueClass

{

    return [NSString self];

}

+ (BOOL)allowsReverseTransformation

{

    return NO;

}

- (id)transformedValue:(id)beforeObject

{

    if (beforeObject == nil) return nil;

    id resourcePath = [[NSBundle mainBundle] resourcePath];

    return [resourcePath stringByAppendingPathComponent:beforeObject];

}

@end

id transformer = [[[PathTransformer alloc] init] autorelease];

[NSValueTransformer setValueTransformer:transformer forName:@"PathTransformer"];

Binding Views to Controllers Using Transformers

Finally, you specify the value transformer when binding your views to your controllers using the valuePath binding. For example, you configure the valuePath binding for the Image table column as follows:

1. Set the Bind to aspect to your array controller object—for example, MediaAssetsController.

2. Set the Controller Key aspect to arrangedObjects (the collection of objects being displayed).

3. Set the Model Key Path aspect to the property containing the image filename. For example, in the media asset application, set the key path to imagePath.

4. Enter the transformer’s logical name, PathTransformer , in the Value Transformer text field.

Figure 2 shows the Bindings pane of an NSTableColumn in Interface Builder with the valuePath binding revealed and configured to use a custom value transformer.

To use the valueURL binding instead, implement a similar value transformer to convert filenames or relative paths to an appropriate NSURL object. Optionally, you can enhance the PathTransformer class to handle other types of filename transformations. In the latter case, register different instances using different names (for example, PathTransformer and URLTransformer) to handle each type of transformation.