To show you how to change the application icon for our Calculator,
we’ll assume that you’ve saved a
copy of the file AppIcon.icns in your
~/Calculator folder as we described in the
previous section. (If you haven’t done this, copy
the file with this name from
/Developer/Examples/AppKit/DotView or some other
AppKit example). Then we’ll tell
PB to use an image from
AppIcon.icns for our
Calculator’s application icon. When the Calculator
program is compiled, the icon’s image will
automatically be included in the Calculator’s
NSBundle folder.
Back in PB with
Calculator.pbproj, choose Project → Add Files.Select the
AppIcon.icnsfile, as shown in Figure 6-21, and click the Open button.
As shown in Figure 6-22, PB will prompt you as to
whether or not you wish to copy the items that you have just selected
(e.g., the AppIcon.icns file) into the
destination group’s folder. The setting of this
checkbox does not matter, because you already copied the
AppIcon.icns file into your project directory.
Do not change any settings in the newly dropped sheet; simply click the Add button.
The AppIcon.icns file should now show up in the
Groups & Files pane (Resources group) in the main PB window. We
like keeping our files well organized in this pane, so
we’ll create a new group called
“Images” in which
we’ll store our icons. Grouping has no real effect
on your application, but it does make it easier to find files in
large projects.
Choose PB’s Project → New Group command and rename “New Group” as “Images”.
Drag the
AppIcon.icnsfile into the new Images group in PB’s Groups & Files pane and drop it when the little gray arrow turns into your highlight color.
Now we’ll make the icon we just created be the application icon for the Calculator application:
Select PB’s vertical Targets tab (at the center, near the bottom of PB’s main window).
Make sure that Development is checked in the Build Styles pane (it should be already).
Select Calculator in the Targets area, and another set of tabs will appear on the right.
Select the newly appeared Applications Settings tab and focus on the Icon section, as shown in Figure 6-23.
Enter the filename
AppIcon.icnsin the “Icon file:” white text field area, as shown in Figure 6-23, and hit Return.Build and run your Calculator application in PB. As usual, save all files before building.
With the application running, choose Calculator → About Calculator. You should see something similar to the screen shot in Figure 6-24 . Note that there is no icon in the About box, but we’ll change that in the next section.
Although it doesn’t always work right away, you
should eventually see the application icon in your Dock to
represent the running Calculator application (see Figure 6-24). You should also see it in the Finder when the Calculator application is
selected in the ~/Calculator/build/ folder. If
your application icon doesn’t show up right away,
try logging out and then logging back in — that worked for us.
Choose Calculator → Quit Calculator.
When we created our new About box in
AboutPanel.nib
, we
left a space for the new application icon in the upper-right corner.
In the following steps, we will add an NSImageView object in our
About box to help display our new application icon:
Back in IB, be sure that
AboutPanel.nibis the active nib by clicking in its Nib File window.Click the Cocoa-Other button, which should be the third one from the left in IB’s Palettes window toolbar.
Add an NSImageView object to the About box by dragging its icon from the Cocoa-Other palette and dropping it into the top-right area of the About box.
Click the Images tab in the
AboutPanel.nibwindow. Note that there are two copies of the icon we created, one labeled “AppIcon” and the other “NSApplicationIcon”.Add our new application icon to the new NSImageView by dragging the AppIcon-labeled icon from the Images pane in the
AboutPanel.nibwindow and dropping it on the NSImageView in the About box. See Figure 6-25 for the result (your icon won’t look exactly like this screen shot yet).
Remove the border around the NSImageView object in the About box by clicking the icon on the left in the Border area of the NSImageView Info dialog.)
Make sure that the image alignment is centered and scaling is set to “Proportionally” in the NSImageView inspector. The result is shown in Figure 6-25.
Back in PB, build and run your project. Save all files when prompted.
Choose the Calculator → About Calculator menu command; you should see your custom application icon, as shown in Figure 6-26.
Figure 6-26. The running Calculator application with the application icon displayed in the About box
Choose Calculator → Quit Calculator.
There is no limit to the number of images that you can add to your application. To add an image to your project, simply drag the GIF, JPEG, or TIFF icon for that image file from your Finder window and drop it into your application’s nib window in IB or in the main window in PB. Images that are stored in one nib cannot easily be used by objects in other nibs. For this reason, it is usually better to store images in the project directory rather than in a nib.