Editing Interface Builder Images - Carbon Dev for MacOS X Wiki

When saving, enter the following:

          __  __######     ______  _____ 
          \ \/ /##   ##   |  ____||_   _|
  ####     \  / ##   ##   | |__     | |  
 ##  ##    /  \ ######    |  __|    | |  
 ##       /_/\_\#####     | |____  _| |_ 
 ##             ##  ##    |______| \___/ 
 ##  ##         ##   ##                  
  ####

Visit Preferences to set your user name

((Interface Builder))

== “How do I get Interface Builder to display images from my project?” ==

[http://developer.apple.com/documentation/DeveloperTools/Conceptual/IBTips/index.html Interface Builder FAQ]

This discussion pertains to test I did with Xcode 2.0 and Interface Builder 2.5.
In Interface Builder (IB) there is a tab panel for images. The default project gives you 3 small icons for alert boxes. You can add other images and icons to this panel.
These images are used with the PICT box control. First you drag the PICT box control to your window or dialog. Then you drag your image from the image panel to that PICT box, or you can just go in the Inspector and set the resource id in the Attributes section. The image will be scaled to fit the dimensions of the PICT box control. You should keep the height/width of that control rectangle in the same proportions are the height/width of the image or distortion of the image will be introduced in scaling.
You don't add the images directly to Interface Builder. You add the images to your project in Xcode and then IB should detect them and make them available. You have to add the images to Xcode in a careful way.
First, the images must be saved as PICT resources. I used Photoshop to do this. I opened my image in Photoshop and selected SaveAs. In the NavPut dialog I selected PICT resource as the file type. When I clicked OK, I was given another dialog that let me set the Resource name and ID for the image. This image is saved in the Resource fork and by default given an extension of .rsr. To be correctly added to your Xcode project the extension must be .rsrc. You can specify that when you save the file, or change it later in the Finder. You should save, or copy, these images to your project folder.
Next, we want to add the images to our project. But, this is tricky for a couple of reasons. I found that if I drag and drop the images into the Resources folder of my project, it didn't work. I need to go to the Project Menu and select Add To Project... Then find your image, which should now be saved as an .rsrc file somewhere in your project folder. This adds the image to the project and it should show up when you switch back to IB. You may need to close and reopen your nib, if it was already open in IB. This gets us half way there. We can now see and use the images in Interface Builder.
If you add them to a dialog, save the nib, and open the dialog in your application, you still might not see the images. When I create a default project using the Carbon Application stationary in Xcode, I get a project that uses NIBS. It does not, by default, use Resources. To get it to use Resources you need to add a new build phase to your target. So, in Xcode select your target. Go to the "Project Menu" and select "New Build Phase". From the pop-up submenu select "New Build ResourceManager Resources Build Phase". This should add a build phase to your target. But, we are still not done!
The trick is that the build phase needs to be added before the "Image.rsrc" files are added to the project. So, remove the .rsrc files from your project. You should delete the reference, not the file. Then go to your "Project Menu" and "Add To Project...". This time the files are added to your project and to your resources build phase. And, when your project is built, Xcode will create a file called "YourAppName.rsrc" inside your application bundle. This file should contain all your images and other resources that you may have added to your project.
Alternatively, if you have already added your .rsrc files to your project, you can drag the files from Resources into the new build phase you have just created. Click the disclosure triangles next to "Targets" -> "YourAppName" to show the new bulid phase, and drop the .rsrc files from Resources onto it.
A note about Resource forks and Data forks. In Classic Macintosh resources were stored in the Resource fork of a file. This is now considered bad form because many UNIX style tools will simply ignore the resource fork and only copy or move the data fork. When Adobe Photoshop saved my image as PICT Resource it did save it in the Resource Fork. I use a program called Resourcerer to resave these resources in the data fork. That way I'm not in danger of losing them accidentally sometime when I'm accessing them over the Internet or through UNIX.
By testing, I found that Xcode doesn't care which fork the resources are stored in. It does care about the extension, which must be .rsrc. The ResourceManager Resources Build Phase will create a resource file in your bundle. That resource file will be stored in the data fork, the way it should be. It will get the added resources to your project from .rsrc files in a resource fork or .rsrc files in a data fork.

Note that this problem affects the sample code in the book "Learning Carbon" by Apple, so simply following the instuctions in the book will lead to the "Moon" PICT resource not displaying in Chapter 5.

A related discussion. [http://www.cocoabuilder.com/archive/message/cocoa/2004/1/5/98320 Re: Adding Images to nib files in IB?] on CocoaBuilder.com

Summary of change:
Add document to category: