Use the Finder to browse to the iPhoto application, located in the /Applications folder.

Control-click on iPhoto. Select Show Package Contents from the context menu. A Finder window rooted at the directory in which iPhoto is located will open. You can use this Finder window to browse around the internals of the application. Figure 13-1 shows a column view of the application.

Create a new Cocoa Application project in Project Builder (File → New Project → Application → Cocoa Application) named “Image Bundle”, and save it in your ~/LearningCocoa folder.

Add some image files to the project using the Add Files command (Project → Add Files). Navigate to the /Library/Desktop Pictures/Abstract folder, select all the JPEG images (named Abstract 1-8.jpg), and click the Add button.

Note

To select multiple files, as required in step 2, you can

-click each image file and then click the Add button to load all of the images at once. This method of selecting files is particularly helpful when you want to pick and choose the files, rather than selecting them all.

When adding files, Project Builder also allows you to select a directory and click the Add button.

In the next sheet that drops down, make sure that the Copy items checkbox is clicked, as shown in Figure 13-3, and click the Add button.

Figure 13-3. Adding files to the project

Save the project (File → Save, or

-S).

Next, open the MainMenu.nib file in Interface Builder.

Drag an image view (NSImageView) object from the Cocoa-Other views palette into the main application window, and resize it so that it occupies the entire window, as shown as Figure 13-4. Set the Autosizing attributes so that the view will expand and contract if the user resizes the window.

Figure 13-4. Adding an Image View to our application window

Create a subclass of NSObject in Interface Builder. To do this, click on the Classes tab of the MainMenu.nib window, find and Control-click on NSObject, and then select Subclass NSObject from the pop-up menu. Name the subclass “Controller”.

Create an outlet named imageView on the Controller object using the Inspector, as shown in Figure 13-5. Type the outlet as NSImageView.

Figure 13-5. Adding an imageView outlet to the Controller class

Create the source files for the Controller class (Classes → Create Files for Controller, or Option-

-F).

Instantiate the Controller class (Classes → Instantiate Controller, or Option-

-I).

Control-drag a connection from the Controller object to the image view. Hook up the connection to the imageView outlet in the Info window.

Save the nib file (

-S), and return to Project Builder.

Add an awakeFromNib method to the Controller.m file as follows:

#import "Controller.h"

@implementation Controller
- (void)awakeFromNib
                     {
                         NSBundle * mainBundle = [NSBundle mainBundle];                     // a
                         NSString * path = [mainBundle pathForResource:@"Abstract 1"        // b
                                                                ofType:@"jpg"];
                         NSImage * image = [[NSImage alloc]initWithContentsOfFile:path];    // c
                         [imageView setImage:image];                                        // d
                         [image release];                                                   // e
                     }
@end

The code we added performs the following tasks:

Build and run (

-R) the application. The application should look like Figure 13-6.

Figure 13-6. Image Bundle running and showing Abstract 1.jpg

Open the Products group in the Groups & Files pane, and examine the Image Bundle.app item, shown in Figure 13-7. This is the built application bundle and all of the resources inside of it. During the build process, Project Builder automatically moves the image files that we added to the project into the Resources directory of the application bundle.

Figure 13-7. Examining the built application bundle for Image Bundle

Edit the Controller.h file, and add the following code:

#import <Cocoa/Cocoa.h>

@interface Controller : NSObject
{
    IBOutlet NSImageView *imageView;
    NSArray * imagePaths;
                         int currentImage;
}
- (IBAction)nextImage:(id)sender;
@end

This allows us to keep track of the paths to all the images in the bundle, as well as keep a count of what image we’re showing. In addition, it adds the method declaration for the action method.

Save (

-S) the Controller.h file.

Open the MainMenu.nib file in Interface Builder.

Click on the Classes tab of the MainMenu.nib window; find the Controller class, and then reread the source file (Classes → Read Controller.h) so that Interface Builder can pick up the new action method.

Add a new button, named Next, to our interface, as shown in Figure 13-8.

Figure 13-8. Adding a Next button to our interface

Connect the Next button to the nextImage: action method on the Controller instance object.

Save the nib, and return to Project Builder.

Modify the awakeFromNib method in Controller.m to match the following code. Note that we have changed lines b and c from the previous implementation of this method.

- (void)awakeFromNib
{
    NSBundle * mainBundle = [NSBundle mainBundle];
    imagePaths = [mainBundle pathsForResourcesOfType:@"jpg"            // a
                                                              inDirectory:nil];
                         [imagePaths retain];                                               // b
                         currentImage = 0;                                                  // c
                         NSImage * image = [[NSImage alloc]initWithContentsOfFile:          // d
                             [imagePaths objectAtIndex:currentImage]];
    [imageView setImage:image];
    [image release];
}

This code performs the following tasks:

Add the nextImage: action method to Controller.m as follows:

                     - (IBAction)nextImage:(id)sender
                     {
                         currentImage++;                                                    // a
                         if (currentImage == [imagePaths count]) {                          // b
                             currentImage = 0;
                         }
                         NSImage * image = [[NSImage alloc]initWithContentsOfFile:          // c
                             [imagePaths objectAtIndex:currentImage]];
                         [imageView setImage:image];                                        // d
                         [image release];
                     }

The code we added performs the following tasks:

Save the project (File → Save, or

-S).

Build and run (

-R) the application. You should now be able to step through the sequence of images in the bundle.

Add a Previous button to the Image Bundle application.

Add keyboard shortcuts for both the Next and Previous buttons.