Building Cocoa Applications: A Step by Step Guide

BUY THIS BOOK

Print Book $64.99

Safari Books Online

What is this?

Print Book £46.50

What is this?

Looking to Reprint this content?

Tell a friend

Building Cocoa Applications: A Step by Step Guide By Simson Garfinkel, Michael Mahoney
May 2002
Pages: 646

Cover | Table of Contents | Colophon

Chapter 1: Understanding theAqua Interface

Content preview·Buy reprint rights for this chapter

The Mac OS X graphical user interface (GUI) is called Aqua. Aqua's advanced use of color, animation, and transparency and its plethora of powerful user-oriented features make it a true delight to use for both novices and power users. To write applications that function well in this environment, a developer should first become proficient at using Aqua as a power user. This means knowing Aqua's GUI guidelines and how applications are structured well enough to accomplish tasks quickly and efficiently. You can then use this knowledge to write applications that provide better interfaces for others.

This chapter contains an introduction to the Aqua GUI and its guidelines. The references at the end of this chapter contain the web addresses for Apple's guidelines. No previous experience with Mac OS X is assumed. All screen shots were taken from Mac OS X Version 10.1.

Mac OS X is special for two important reasons. First, it brings the popular Macintosh operating system interface into the 21st century with a new, object-oriented environment that is almost as easy to program as it is to use. Second, Mac OS X brings the world's easiest-to-use interface (Aqua) to the venerable Unix operating system, which is the underlying basis of Mac OS X. This has allowed Apple almost overnight to claim the largest installation of Unix operating systems on the planet: tens of millions! There are now more installed copies of Mac OS X than of all other desktop Unix variants combined, including Sun, Linux, HP, IBM, and more. Unix lovers, take note!

Aqua is the interface to all of the next-generation Mac OS X applications, including the Finder, the Dock, Mail, TextEdit, and many other applications that are bundled with Mac OS X. The most important of these applications is the Finder, which is an improved reimplementation of the traditional Finder for the Macintosh.

The Mac OS X Finder lets you start up programs and manage the filesystem primarily through point-and-click activities that are natural to the user. With the Finder, you can copy 10 MB of files from one disk to another, launch (run) several programs, open and print an 80-page document, recursively change the permissions on files, and view a graphics file in a panel all at the same time! That would not be possible with previous versions of Mac OS.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

What Makes Mac OS X So Special?

Content preview·Buy reprint rights for this chapter

Mac OS X is also special because of its embedded imaging model, Quartz. (An imaging model does the actual drawing on the screen or on a printer.) Based on Adobe's Portable Document Format (PDF), the next-generation version of Adobe's PostScript page-description language, Quartz provides a true WYSIWYG ("wizzy-wig," or what-you-see-is-what-you-get) capability because the imaging model for printing is the same as that for the screen. This is a marvelous asset for any application that uses text or graphics (and what application doesn't?).

Where Mac OS X shines brightest, however, is in its development environment,

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

A Quick Look at the Mac OS X User Interface

Content preview·Buy reprint rights for this chapter

Let's take a look at the main components of the Mac OS X user interface. Figure 1-1 contains a screen shot of a typical Mac OS X user's screen. The screen background, called the desktop , is light gray (you can change the color). The always-available Apple system menu at the top left opened when the Apple icon above it was clicked. The Mac OS X Finder is the active application , and thus its menu populates the rest of the menu bar at the top of the screen. The Finder window at the top of the screen is the active window , and its Info dialog is at the bottom left. (A dialog is a special type of window that gives information about or instructions to an application.) The Info dialog contains a number of labels that show information about the selected folder and a checkbox to set a folder attribute. It also contains a pop-up menu that can be used to change the view (information) that the Info dialog currently displays. We'll discuss these screen objects in more detail later in this chapter.

Figure 1-1: Mac OS X user's desktop

The Dock at the right of Figure 1-1 contains 14 icons, the first 12 representing applications (programs). (The Dock can also be positioned at the bottom or left of the screen; it's the user's preference.) The two icons at the bottom of the Dock represent a minimized document window and the Trash.

The Finder ("Happy Mac") icon, which represents the Finder, is always at the beginning (left or top) of the Dock. If you move your mouse over an application icon in the Dock (i.e., move the mouse pointer over an icon without pressing or clicking), the application's name will be displayed next to the icon. If you press and hold the mouse button down on an application icon (e.g., the Finder icon) in the Dock, a menu will pop up and display (as menu items) the names of the windows that are currently open for that application (see Figure 1-2). If you continue to hold down the mouse button and then drag it and release it over one of those menu items, the corresponding window will come to the foreground. This is especially handy if an application has many open windows or has windows buried under the windows belonging to other applications.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Basic Principles of the Aqua Interface

Content preview·Buy reprint rights for this chapter

Before the release of the original Macintosh, different applications running on the same computer in environments such as MS-DOS had wildly different interfaces. Some applications used the mouse; others used only the keyboard. Some applications were character-oriented; others created their own primitive window systems. This was a heavy burden on users and severely limited their overall productivity.

One of the primary goals of the original Macintosh was that different applications running on the same computer would have a consistent user interface. Consistency helps users because they don't have to learn a new set of rules to perform the same basic operations as they move from application to application. (Think of how easy it is to drive different brands of automobiles — no additional training is required because they all have steering wheels, brakes, and accelerators that work the same way.)

The original Macintosh delivered this consistent user interface through a set of procedures stored in a read-only memory (ROM) called the Toolbox . Developers who wrote applications for the Mac, regardless of whether they were writing a word processor or a spreadsheet, were encouraged to use the Macintosh Toolbox to display the application's user interface. This made things easier for users, because all applications behaved in the same way. It also made things easier for developers, because they did not have to reimplement things like scrollbars or menus for every application that they wrote.

Over the years, another advantage of the Toolbox became evident; as the operating system was improved and new features were added to the Toolbox, existing programs could get new functionality "for free." When Apple moved from Macintosh System 6 to System 7, well-behaved applications could suddenly operate in a multiapplication environment. Likewise, when System 7 gave way to Mac OS 8, applications that used the Toolbox and followed its conventions were able to take advantage of Mac OS 8's visual enhancements to the Macintosh interface. Indeed, the Toolbox was so integral to the Macintosh platform that many applications built without the Toolbox proved to be buggy and crashed a lot, and as a result, they were not successful in the marketplace.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

The Mouse and Cursor

Content preview·Buy reprint rights for this chapter

You can do two basic things with a mouse: move it and click its button.

Four different mouse events (actions) can be derived from these basic actions:

Clicking (single-clicking): Pressing and releasing a mouse button (mouse down and mouse up) without changing the position of the mouse.
Clicking (or single-clicking) is used to select an object or location on the screen. For example, you can click a button or menu command to select some action, click an icon or filename in a list to select it for further action, click in a window to bring it in front of other windows, or click on a piece of text to select an insertion point.
Multiple-clicking: Pressing and releasing a mouse button two or three times in rapid succession without changing the position of the mouse.
Multiple-clicking extends the action of clicking. For example, you can click on a piece of text to select an insertion point, double-click to extend the action to select the nearest word, and triple-click to select the entire line or paragraph. Likewise, you can click a file icon in the Finder to select a file and double-click the icon to open the file in its associated application.
Dragging: Pressing and holding down a mouse button and then moving the mouse (and thus the cursor); release the mouse button to end.
Dragging is used primarily to move an object or define a range. For example, you can drag a window's title bar to move the window, drag a file icon to reposition it in a Finder window, or drag the knob on a slider or scroller to select a value or scroll through a window. You can also use dragging to define a range of characters in a text area, or to select a group of graphics in a drawing area or icons in a file area. The last two operations use a technique known as rubberbanding , where a lightly drawn rectangle indicates the selection range.
Pressing: Pressing and holding down a mouse button in place; release the mouse button to end.
Pressing is used mainly as a substitute for repeated single-clicks. For example, you can repeatedly click a scroll button to move through the contents of a document window, or you can simply press the scroll button and let the window scroll.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Window Types and Behavior

Content preview·Buy reprint rights for this chapter

On-screen windows fall into four principal categories, which vary in appearance and function:

Document windows
Utility windows
Dialogs (includes sheets)
Alerts

We'll describe each of these window types in the following sections. After that we'll discuss how and when these four types of windows become the main or key window in an application. For many of our examples we'll use the TextEdit application, the basic word-processor application bundled with Mac OS X and located in the /Applications folder.

A document window is file-based and is the main working area of an application. A window containing a text document being edited in a word processor is a document window, as is a window containing a spreadsheet in a spreadsheet application or an image being manipulated in a graphics editor application. Most document windows, like some of the windows in Figure 1-1 and the window in Figure 1-3, have resize controls and close, minimize, and zoom buttons. The resize control is at the lower-right corner of a document window, while the three window-control buttons are on the left side of the window's title bar.

Figure 1-3: A document window in TextEdit editing a file called "Document Window"

The small proxy (file) icon to the left of the title in a document window can be manipulated with drag-and-drop, as can a file icon in the Finder. Command-pressing the proxy icon causes the complete folder path of the document file to appear, and when a user drags to one of those folders and releases the mouse button, the corresponding folder opens in the Finder (even if the proxy icon is in a document window from another application, such as TextEdit.)

A document window's close button displays an X inside it when the document is saved to disk and a dot when the document has not been saved. Document windows usually contain vertical and/or horizontal scrollers when the window contents are too large to fit in the window. An application can have many document windows open at the same time.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Menus and the Menu Bar

Content preview·Buy reprint rights for this chapter

Menus contain a list of commands, states, and submenus that can be chosen with the mouse. The Mac OS X menu bar stretches across the top of the screen and is always visible, except when a slide show, full-screen video, or some other display application takes over the entire screen. The Apple menu , which drops down when the Apple icon (

) at the top left of the screen is clicked, is always available, even during application and document modal periods. The Apple menu, shown in Figure 1-13, is controlled by the operating system, not by any one application or by the user.

Figure 1-13: The Apple menu is always available and is controlled by the operating system

To the immediate right of the Apple menu is the application menu . The application menu changes depending on the active application, and it displays the active (or current) application's name in bold text. By convention, the application menu contains commands that affect the entire application, such as Preferences, Hide Others, and Quit. The application menu for the TextEdit application is shown at the left in Figure 1-14.

Figure 1-14: Menu bar for TextEdit (top), with Application, File, Edit, and Window menus

Each application has its own set of menus, and we've exploded four of TextEdit's six menus in Figure 1-14. In addition to the application menu, the File and Window menus should be present for all applications. Edit, Format, and Help menus are common but are not required by the Apple interface guidelines. Other application-specific menus (e.g., the Go menu in the Finder) may also be present.

A dark gray disclosure triangle (

) at the right side of a menu cell is a submenu indicator . A key combination containing the cloverleaf symbol (

) — also known as the Command key — in combination with a character key and possibly modifier keys (e.g., Shift, Option) is called a keyboard equivalent , or key equivalent, to the mouse. Key equivalents are used in combination with the Command (Apple, cloverleaf ) key (or keys) at the bottom of the keyboard. Menu commands that bring up dialogs are usually followed by three dots (an

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

The Dock

Content preview·Buy reprint rights for this chapter

The Mac OS X Dock replaces the Mac OS 9 Application menu. Always available (though it may be temporarily hidden), the Dock is designed to reduce on-screen disorder and help users organize their work. The Dock always contains the Finder icon and the Trash icon in the first and last positions, respectively, as shown in Figure 1-15. The Dock can also contain any number of additional icons that fall into four groups: running applications, minimized documents, file/folder icons, and application icons for commonly used applications (running or not) such as Mail, iTunes, and Internet Explorer. Every open application's icon and every minimized document icon (for non-hidden applications) is in the Dock. The commonly used applications that populate the Dock are the choice of the user.

Figure 1-15: The Dock (bottom) location and appearance can be controlled via the Dock submenu

By choosing a menu command from the Dock submenu located in the Apple menu (see the top of Figure 1-15), a user can turn magnification and hiding on or off. When turned on, the magnification feature causes each icon in the Dock to enlarge when the mouse is positioned over it. When turned on, the hidden feature causes the Dock to "hide" off-screen unless the mouse is positioned over it. Users can also position the Dock as a whole at the left, right, or bottom of the screen. We prefer the Dock on the left or right side of the screen because most documents are portrait-shaped, and a Dock at the bottom of the screen gets in the way.

Users can access additional Dock preferences through the System Preferences application. We'll experiment with those preferences in the step-by-step exercises later in this chapter.

The example Dock in Figure 1-15 contains 15 icons, 6 of which represent running applications (indicated by a black triangle below each icon). The first icon on the left is the Finder, which is always running. The second icon from the left is the running Mac OS X Mail application, which sports a "live" badge with the number of unread mail messages. The last three icons on the right are separated from the others by a slight gap with a barely visible line. This part of the Dock contains minimized document windows and is where the user can place file and folder icons from the Finder for quick access. The user's Library folder icon is second from the right, and a minimized TextEdit document is third from the right. Minimized document icons are actually miniature versions of the windows they represent — great feedback for the user.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Controls

Content preview·Buy reprint rights for this chapter

Mac OS X controls are on-screen graphical objects that perform like physical control devices we use every day. Consider a car stereo system that has an on-off switch with an indicator light, a row of buttons to select a radio station, a sliding knob to set volume, and a push button for ejecting an audio CD. Each of these devices is a control device with a different function. The on-off switch is a toggle, the radio buttons allow a choice of one out of many options, the slider sets a level or value, and the push button causes an action. All of these physical control devices have analogous on-screen controls that can be manipulated by the mouse in Mac OS X.

There are several common control types in the Mac OS X user interface, which we will discuss in the following sections:

Push buttons
Radio buttons and checkboxes
Pop-up menus, command pop-down menus, and combination boxes
Text fields and scrolling lists
Sliders and scrollers
Color wells and image wells
Disclosure triangles

There are several types of on-screen buttons. They fall into two main groups: action buttons and two-state buttons. An action button performs a single task, such as opening a dialog, saving a file, copying text, or closing a window. A two-state button sets a single feature or attribute on or off, such as whether text should be in bold font or a drawer should be displayed. In the car stereo analogy, the eject button is an action button, while the on-off switch is a two-state button. The set of car radio buttons is analogous to a matrix (group) of two-state buttons, each indicating whether the associated radio station is selected. There is more structure to this matrix of radio buttons, however, because only one of the two-state buttons may be selected at any one time. A checkbox is another example of a two-state button.

Section 1.8.1.1: Push buttons

A push button looks like a rounded rectangle with a text label on it. Clicking a push button performs an immediate action, such as printing a document, canceling a dialog, or responding to an alert message. Push button names should be verbs (such as Open, Print, Save, or Cancel) that describe the action to be performed.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

The Finder

Content preview·Buy reprint rights for this chapter

The Finder is a special application in Mac OS X, because it oversees the Aqua environment and allows easy access to all other applications. It never stops running while you're logged in. The Mac OS icon represents the Finder, just as the TextEdit icon represents the TextEdit application. You can activate the Finder any time you want by clicking this icon in the Dock — it's always available (it may be invisible, but it's easy to find).

Although the Finder is special, it acts like other applications in most ways. It has a menu, submenus, windows, utility windows, and so on that can be manipulated just like those provided in other applications. We begin our in-depth discussion of the Finder with the Finder window.

The Finder window is the primary interface that you will use for viewing and manipulating files in the Mac OS X (Unix) hierarchical filesystem. The Finder window supports three different views (panes) of files: icon view, list view, and column view. A user can select his favored view by clicking one of the three mutually exclusive view-control buttons at the left of the Finder's toolbar. We present the same Finder window showing three different views of the commonly used /Applications folder in Figure 1-20, Figure 1-21, and Figure 1-22.

Figure 1-20: Finder's icon view for the /Applications folder

Figure 1-21: Finder's list view for the /Applications folder

Figure 1-22: Finder's column view for the /Applications folder

No matter which view you choose, the Finder window's content area consists of three main parts: the toolbar, the status bar, and the view pane. The toolbar and status bar can be hidden via the Finder's View menu, but the view pane is always visible. The Finder status bar displays the number of items (files and folders) in the selected folder and the space available on disk. The Finder toolbar contains several types of buttons for viewing and manipulating files and folders, including the three view-control buttons discussed previously. Like the Back button on a web browser, the Back button in the Finder toolbar returns you to the previous view.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Configuring Your Desktop, Step by Step

Content preview·Buy reprint rights for this chapter

This section takes you on a guided tour of the Mac OS X Finder and System Preferences applications. We assume that you have the Mac OS X Developer Tools installed. All of the steps work under Mac OS X Version 10.1.

To get the most out of these exercises, we recommend that you follow them precisely. For example, start by logging in and do not close any windows or dialogs unless instructed to do so. If you do not follow a step precisely or if you skip a step, subsequent steps may not make sense.

The steps in configuring your desktop are as follows. As with all step-by-step exercises in this book, we recommend that you follow these steps precisely.

Start up your computer and log in.
The Finder will be running, and the Finder menu will appear in the menu bar at the top of the screen. A Finder window will appear in the center of the screen, and the Dock will be at the bottom of the screen (unless you've closed it or previously changed its position, in which case you should choose Finder → New Finder Window).
Note the black triangle below the Mac OS Finder icon. This triangle indicates that the Finder is running. If your Dock is on the side of your screen, the triangle will be on the side of the icon, rather than below it.
Move your Finder window around the desktop by dragging its title bar. Any window can be moved in this way.
Note that you cannot drag a window above the menu bar, but you can drag it partially off-screen to the left or right or at the bottom. Note also that the window goes "under" the Dock but is only partially obscured.
Resize your Finder window by dragging the resize control in the lower-right corner.
Click the green zoom button at the top left of the window. Note that the window changes size (perhaps to fill the working area). Click the zoom button again to restore the previous size.
Windows have an initial size and position that are set by the application and are called the standard state . If a user resizes or moves a window, the window is in the user state . The zoom button simply toggles between the standard and user states. Each of the three views in the Finder has its own standard state.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Menu Guidelines and Keyboard Equivalents

Content preview·Buy reprint rights for this chapter

Developers should follow Aqua's menu guidelines carefully so users of their applications can learn and work faster. Common menu structure and commands are crucial to better user productivity within a GUI. In this section, we discuss most of the standard Mac OS X menus and associated keyboard equivalent guidelines. For further details, see the "Introduction to the Aqua Human Interface Guidelines" at Apple's developer web site or in the /Developer folder (references are provided at the end of this chapter).

A keyboard equivalent is a way of manipulating a graphical object (usually a menu) using the keyboard rather than the mouse. To use a keyboard equivalent, type a single key (perhaps modified by the Shift key) while pressing one of the Command keys near the bottom of the Apple keyboard (depending on your Mac, you may have only one Command key on your keyboard). Experienced users use keyboard equivalents because they are faster than manipulating the mouse. Using the mouse is a more natural way to manipulate graphical objects, but it's often slower and less convenient, either because the user's hands are already on the keyboard or because mouse (cursor) movements across a screen are time-consuming and clumsy.

A keyboard equivalent usually substitutes for a click on a menu command from the menu bar, but it may also substitute for a pop-up menu command. Pop-up menu key equivalents should be digits (e.g., Command-2 activates the second item down from the top of a pop-up menu, as shown in Figure 1-30).

Figure 1-30: Command-2 activates the second item of this fictional pop-up menu

Because most keyboard equivalents are common across applications, a user will need to learn only a few of them to work considerably faster. The most common and useful keyboard equivalents are listed in the tables in the following sections. Others can be seen in the screen shots of the menus themselves. Note that the keyboard equivalent labels on Mac OS X menus are displayed in capital letters, but you must actually use lowercase letters to make the commands work (unless the label contains the shift icon — for example, File

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Working with the Filesystem,Step by Step

Content preview·Buy reprint rights for this chapter

The Mac OS X Finder is primarily used for managing files stored on your computer's hard and floppy disks, and over the network. This section discusses many of the Finder's operations and menu commands for managing files and folders.

Log into your account on a computer running Mac OS X. Make sure that the Finder is the active application and that only one of its windows is open.
Open your Home folder (directory) by selecting (with a single-click) the Home icon toward the center of the toolbar in the Finder window.
Switch to icon view in the Finder.

Create a new folder in your Home folder by choosing File → New Folder from the menu bar. The new folder will be named "untitled folder".
Make sure the text "untitled folder" is selected (in your highlight color). If it isn't, double-click the text "untitled folder" to select it.
Rename the new folder stuff by entering "stuff" on the keyboard.
Make your stuff folder easily accessible by dragging its icon from your Finder view pane and dropping it on your Finder toolbar (widen the Finder window if necessary). Whenever you need to access the stuff folder, all you need to do is click its icon in the Finder toolbar.
Switch to column view in the Finder.
Open the /System/Library/Sounds folder in the Finder window by:
1. Clicking the Computer icon in the Finder's toolbar
2. Clicking the Macintosh HD icon (or wherever your Mac OS X operating system is located)
3. Clicking the System folder, then the Library folder, and finally the Sounds folder (you'll probably have to scroll down to see it)
Traversing through the filesystem this way is easiest in column-view mode. Icon-view mode requires double-clicks, and the folders are more difficult to find. However, there's an even easier way to get to the Sounds folder, as we'll see next.
Choose Finder's Go → Go to Folder menu command, and note that a sheet drops down from the active Finder window (see Figure 1-37).

Figure 1-37: The Go to Folder sheet in the Finder

Type in "/Sys" in the Go to Folder sheet, and the Finder will complete the folder name to "System" for you. Hit the Tab key to accept the completion.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Summary

Content preview·Buy reprint rights for this chapter

Although there is more to learn about using Mac OS X, this introduction is probably enough to get you started and feeling comfortable with the interface. Keep the user guidelines you learned in this chapter in mind when designing application interfaces — your users will thank you for it. You might also want to bookmark the references shown at the end of this chapter.

In the next chapter, we'll learn how to work with some of the most important Cocoa developer tools. Then, in Chapter 3, we'll create our first program.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Exercises

Content preview·Buy reprint rights for this chapter

Go through Section 1.10. Make a list of the things you discovered while working through the steps.
Open document windows, utility windows, and dialogs in the TextEdit application to convince yourself that the window order we discussed in this chapter is accurate.
Open two viewer windows, utility windows, and dialogs in the Mail application to convince yourself that the window order we discussed in this chapter is accurate. Note how the Colors and Font utility windows are the same from application to application.
Look at the Services menu for several Mac OS X applications, including the Finder, Mail, TextEdit, and your web browser. Determine why services are included for some applications but not others. Also determine the context in which services items are dimmed and unavailable for these same applications.
See how many violations of Aqua user interface guidelines you can find in the bundled applications in the /Applications folder. Look for naming, menu placement, key equivalents, and window-order violations. Use the references in the next section.
Go through Section 1.12. Make a list of the things you discovered while working through the steps.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

References

Content preview·Buy reprint rights for this chapter

Many of these references are installed on your computer when you install the developer tools; they're also on Apple's web site (http://developer.apple.com). The advantage of using the pages on your computer is that they should match whatever version of Cocoa you are using, whereas the version on the Apple web site will match Apple's most recent version of Cocoa. However, we prefer the version on Apple's web site, as those pages seem easier to use and frequently have more complete descriptions of Cocoa concepts.

Cocoa developer documentation:
http://developer.apple.com/techpubs/macosx/Cocoa/CocoaTopics.html
Mac OS X terminology guidelines:
http://developer.apple.com/techpubs/macosx/Essentials/AquaHIGuidelines/AppBTerms/index.html
Introduction to the Aqua Human Interface Guidelines:
http://developer.apple.com/techpubs/macosx/Essentials/AquaHIGuidelines/AHGIntro/index.html
User interface elements:
http://developer.apple.com/techpubs/macosx/Cocoa/TasksAndConcepts/ProgrammingTopics/Misc/UIElementsPage.html

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Chapter 2: Tools for Developing Cocoa Applications

Content preview·Buy reprint rights for this chapter

There are several applications bundled with Mac OS X that are very useful for writing Cocoa programs. Most of these tools reside in the /Developer/Applications folder, but some reside in the more user-oriented /Applications/Utilities folder. We'll discuss the most helpful of these tools in this chapter.

The two most important Mac OS X developer tools by far are Project Builder (PB) and Interface Builder (IB). These tools reside in the /Developer/Applications folder, shown in Figure 2-1.

Figure 2-1: The developer applications bundled with the Mac OS X developer system

The third application you'll need to learn as a Cocoa developer is the gdb debugger. We'll discuss gdb and how it's used at the Unix command line and with PB toward the end of this chapter. We'll also take a quick look at the ObjectAlloc, PropertyListEditor, IconComposer, icns Browser, Console, ProcessViewer, and Terminal applications.

Project Builder is Cocoa's integrated development environment (IDE), used to manage application development projects. For each application, developers will use PB to create a skeletal application framework, organize the application's resources, edit the Objective-C source code files, run the compiler and the rest of the build process, control the debugger, add application and document icons, and set up other application features. PB does a lot for developers — it's a wonderful tool!

The PB menu bar and main window for an under-construction application called Calculator are shown in Figure 2-2. The buttons on the left of the toolbar are for building (compiling), cleaning, running, and debugging applications. The pop-up menu that currently displays "Calculator" is for switching build targets, whereas the buttons on the right of the toolbar are for stepping through an application being debugged. The Groups & Files pane at the left of the window in Figure 2-2 shows the files that make up the project, including the Classes files where you add your application-specific code. The top-right pane shows the output from a compilation process, and the bottom-right pane shows a file (

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Developer Tools

Content preview·Buy reprint rights for this chapter

The two most important Mac OS X developer tools by far are Project Builder (PB) and Interface Builder (IB). These tools reside in the /Developer/Applications folder, shown in Figure 2-1.

Figure 2-1: The developer applications bundled with the Mac OS X developer system

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Utilities

Content preview·Buy reprint rights for this chapter

In addition to the applications found in /Developer/Applications, there are several useful developer tools in the /Applications/Utilities folder. These applications are bundled with the user system, but they can still help developers. The /Application/Utilities folder is shown in Figure 2-7. The icons in this folder are rather plain (look at your screen, not the screen shot in the book), indicating their utility status (compare them with the more colorful icons for the "fancy" applications in the /Developer/Applications folder).

Figure 2-7: The /Application/Utilities folder contains useful tools for developers

The Console displays information that other applications print on the system console. This should be familiar to the Unix-savvy. Many Mac OS X programs display error messages on the system console rather than writing them to a file. The Console application can also show you a stack-trace of a program that crashes. We suggest you keep this application handy when programming and testing.

The ProcessViewer graphically shows you all of the processes that are currently running on your computer. Its output is similar to that of the common Unix programs top and ps, which can be run in a Terminal window in Mac OS X. A screen shot of the user processes for the logged-in user (as opposed to the administrator processes) is shown in Figure 2-8.

Figure 2-8: ProcessViewer displaying user processes

The Terminal enables you to work at the Unix command line. There is no counterpart for Terminal in previous versions of Mac OS, and it's much more powerful than the DOS command line familiar to Microsoft Windows users. Within Terminal, you can fully explore the file and operating systems, directly run compilers, run programs, and do much more. If you are familiar with other Unix operating systems such as Solaris or Linux, Terminal will make you feel right at home. In the next section, we'll set the scene by explaining some of the history behind Unix and computing in general. Then we'll show you a little about Terminal itself.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Working with the Terminal

Content preview·Buy reprint rights for this chapter

In this section, we'll cover the details of the Mac OS X Terminal application. Before getting into those details, though, we'll take a step back to look briefly at the history of the video display terminal itself. That should give you some insight into why the Terminal application developed in the way it did.

Many years ago, long before personal computers were developed, computer systems were too big and too expensive to put on a single person's desk. Instead, computers were put in special-purpose rooms (called "computer rooms"), where a staff of highly-trained professionals worked around the clock to keep the machines running. Many computer systems read their programs from decks of 80-column computer punch cards, each of which was punched with a series of holes that represented a single line of text. When a program was finished running the results were printed on a line printer. These systems were said to implement "batch mode processing" because programs were run in batches — there was no interactivity at all!

One of the first revolutions in computing was the development of interactive systems. In addition to being attached to a card reader and a line printer, the computer was equipped with a modified teletype printer. Every time a key on the teletype was pressed, a distinct code was sent to the computer. Every time the computer sent a code to the teletype, the teletype would literally print a letter onto a roll of paper. These interactive systems made the computer much easier to use. Over time, the teletype printers were replaced with special-purpose printing terminals that were designed specifically for interactive computing, rather than for sending telegrams and telexes.

The first video screens were connected to computers by the U.S. military in the late 1950s, and by universities and research labs in the 1960s. These computer-controlled video systems were incredibly expensive. The screens were also very specialized: usually, each video system was designed to run a specific application. Over time, however, the video systems became more general-purpose.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Debugging Programs with gdb

Content preview·Buy reprint rights for this chapter

The GNU debugger is gdb . It was written and is maintained by the Free Software Foundation. gdb is a powerful tool for looking inside a running program and trying to figure out why that program is not behaving as expected. Apple has modified gdb to be aware of Objective-C syntax and objects, and to work together with the PB and Terminal applications.

The gdb tool is located in the directory /usr/bin. If you click the Computer icon in the Finder's toolbar and then select Macintosh HD, you will not see /usr listed. Mac OS X and the Finder hide many system details from the user, including Unix system directories such as /usr/bin, /bin, and /etc. You can view these directories in the Finder using the Go to Folder sheet, but you cannot see all directories in the Finder (e.g., the .app directories are hidden). You can, however, see all the filesystem directories in a Terminal shell — your vehicle for exploring the guts of Mac OS X.

The easiest way to use the gdb debugger is in PB. We'll show you how to get started with that in this section. First, we must have an application to work with, so we'll use a copy of the CircleView example application that is bundled with the Mac OS X developer system.

When you debug a running program within PB, you can access some of the most useful gdb commands graphically. You can set breakpoints by clicking the mouse next to a line of code (a breakpoint is a place where a running program stops executing and control is returned to the debugger). When a breakpoint is reached in a running program, the stack frame and the variables on the stack will be displayed in the debugger window. You can also use the buttons on the upper-right side of the PB window to control execution. The up and down arrows will step you up and down the call stack. The arrow over the parenthesis will execute a gdb step command. The pause button will pause execution, and the button with the triangle will continue program execution.

Let's try a few of these commands on a real example:

Open the Go to Folder sheet in the Finder and enter "/Developer/Examples/AppKit".

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

User Interface Design

Content preview·Buy reprint rights for this chapter

Although not strictly a development tool, user interface design is certainly something that developers need to be concerned about. Some developers spend far too little time designing the user interface of an application, yet that is the part that makes the first impression on most users. An application's user interface may well determine its success or failure.

To properly address all user interface design issues would take another book. However, user interface design is so important that we've listed a few tips for novice designers here:

When developing a new application, create the user interface first. Then the user interface will more likely be written for the user, not the programmer. There's nothing worse than making an interface conform to code. Remember, you are writing your application for users, not for yourself.
Don't put too many windows on the screen when your application is launched. If you do, the user may be confused and may not even know where the focus of your application lies. Also, don't start up your application with windows overlapping one another.
Don't violate users' expectations. In part, this means that you should follow the Aqua user interface guidelines for menus, windows, panels, and so on. If you don't have the time to read the interface guidelines (they are long, but are discussed throughout Chapter 1), try to make your application look and work like other Aqua applications, such as the Finder, Mail, and TextEdit.
Don't confuse the grouping of functionality. Some applications are riddled with menus and dialogs that confuse functionality. For example, viewing and font options should not be in the same menu.
Balance your menus so that there are no more than 10 items per menu. Also, avoid creating short menus (i.e., one or two items) between the standard Edit and Window menus.
Don't use too many different fonts and styles for your application. Keep the interface as simple as possible, and show your tricks in the About box.
Provide sufficient WYSIWYG before a choice is set so that the user knows what the result of an action will be. For example, in the General pane of the System Preferences application, the Appearance and Highlight colors are displayed in the pop-up menu before they are selected.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Summary

Content preview·Buy reprint rights for this chapter

In this chapter, we started out by taking a brief look at many of the Cocoa development tools. In /Developer/Applications, where most of the tools are located, we looked at PB, IB, ObjectAlloc, PropertyListEditor, IconComposer, and the icns Browser. There are other useful tools in that folder that we did not cover — launch them and find out what they do. In /Applications/Utilities, we looked at Terminal, Console, and ProcessViewer. We spent the most time with the gdb debugger, because it's an essential developer tool. We also worked with the filesystem and took a quick look at user interface design.

In the next chapter we'll take a closer look at IB, Apple's powerful tool for building application interfaces, and create our first program.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Exercises

Content preview·Buy reprint rights for this chapter

Work through the steps in Section 2.1.3.
Work through Section 2.3.3. Make a list of the things you discovered while working through the steps.
Work through Section 2.4.1.
Copy the /Developer/Examples/AppKit/TextEdit folder into your Home folder and build and run it — it's the same TextEdit application that we used in the last chapter. Explore the files associated with the TextEdit project in PB and IconComposer.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Chapter 3: Creating a Simple Application with Interface Builder

Content preview·Buy reprint rights for this chapter

Interface Builder is Cocoa's main development tool for creating user interfaces for your applications. It lets you graphically design the windows that your application will use, together with all of their associated menus, buttons, sliders, and other objects. After you've put together the basic interface for your application, IB lets you "wire" (connect) together the parts (objects) and save all these specifications so that your application can use them when it runs.

This chapter introduces you to IB. We'll build a very simple interface for an application and test it with IB's Test Interface command. We won't use this interface beyond this chapter; we won't even save it. Our only goal here is to give you a sense of the ease and power of IB.

Let's start by taking a look at a typical Cocoa developer's screen, shown in Figure 3-1. The application being built is a simple calculator, and the IB development tool is the active application. The window at the top left that looks like a calculator is the interface for the calculator application under development. Similarly, the small window below the calculator window is the menu interface for the calculator application. The window at the bottom left and the two windows near the Dock are IB development support windows (and therefore aren't part of the calculator application itself ). In the center of the screen is a Project Builder window containing source code for the calculator application. We'll use both PB and IB in Chapters Chapter 5 through Chapter 8 to create this very calculator application. An important icon in the Dock is the icon for IB.

Figure 3-1: A Cocoa developer's screen

At first glance you might think of IB as only an application prototyping tool. While IB can be used for prototypes, its primary use is to build the actual graphical user interfaces for Cocoa applications. IB is much more than a prototyper; it is an integral part of the Cocoa programming environment.

IB works together with PB to provide a skeleton of source code to which a developer can add application-specific code. Note the hammer in PB's icon.

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Getting Started with Interface Builder

Content preview·Buy reprint rights for this chapter

Launch IB by clicking its icon in your Dock (or Finder).
Choose Interface Builder → Hide Others to simplify your screen.

Your screen should look similar to the screen shot in Figure 3-2. IB's main menu is at the top of the screen, its Starting Point window is on the left, and its Palettes window is on the right of the screen. The windows on your screen may be in different locations, and the Palettes window may show a different palette from the Cocoa-Menus palette shown in Figure 3-2 (click the buttons in the Palettes window toolbar to change the palette). You can specify which windows show up at launch time in IB's Preferences dialog. Also, as with many Mac OS X applications, IB will remember its state from when it was last terminated.

Figure 3-2: IB immediately after launch

Now that we've launched IB, we can start building our own application.

Make sure that Cocoa → Application is selected in IB's Starting Point window (as in Figure 3-2), then click the New button.

The screen has now become more interesting, with the addition of three new items (see Figure 3-3). Near the top of the screen in Figure 3-3 is an empty window titled "Window" (again, note that the locations of these windows on your screen may differ slightly). On the left in the middle of the screen is a menu bar titled "Untitled - MainMenu". Don't try choosing commands from this menu right now — it's the main menu for the application that you are building. In subsequent chapters we'll show how you can tailor this menu with commands and submenus to suit a particular application.

Figure 3-3: IB after creating a new Cocoa application

In the lower-left corner of the screen in Figure 3-3 is the Nib File window for the new application. The Nib File window and menu are titled "Untitled", because you have yet to give the application a name. A nib is a file that contains information about an application's interface; we'll discuss nib files in great detail later. (Note that the Palettes window at the right in Figure 3-3 shows a new palette, the Cocoa-Other palette. We clicked the third item from the left in the Palettes window toolbar so you could see this palette in the figure).

Additional content appearing in this section has been removed.
Purchase this book now or read it online at Safari to get the whole thing!

Adding Objects to Your Application

Content preview·Buy reprint rights for this chapter

In this section, we'll customize our new application's main window, "Window". It's wonderful that IB automatically provides every new application with this window, but it's rarely the right size. Sometimes it's too small; usually it's too big. Fortunately, we can easily resize the window as we would any Mac OS X window.

Resize the window titled "Window" to a height of about one inch and a width of about three inches.

Notice that you don't need to know the exact height and width of this window to set its size; you simply resize it visually and you're done (remember, you're building an application here). This is a good example of the basic philosophy of IB — graphical things are best done graphically. This philosophy is at the heart of Cocoa's ease of programming. (On the other hand, you can resize the window to precise dimensions using the NSWindow Info dialog, if necessary.)

The IB Palettes window near the upper-right corner