This tutorial shows you how to create your first Cocoa app. It assumes no previous experience with programming or Xcode.

The app you will not write any code for this app, but it will still have some impressive features. The screenshots and descriptions refer to Mac OS X 10.5 Leopard (click here for Tiger version).

This tutorial is written and illustrated by Scott Stevenson

First, Launch Xcode. You can find it in /Developer/Applications. If Xcode is not there, you can install it from the Mac OS X installation DVD or the disc that came with your Mac. The installer is called Xcode Tools.

You must install the version of Xcode which matches your version of Mac OS X. In other words, to run Xcode on Leopard, you must install the version that comes with Leopard.

Once Xcode is running, open Xcode → Preferences and set your Layout to All-in-One.

All-in-One is the layout preferred by many pros, and is used in all of the visuals in this tutorial.

After you've changed the layout, close the Preferences window and choose File → New Project

Choose Cocoa Application. Some of the items in the project list have similar names, so choose carefully. Click the Next button, and you'll be asked to name the project:

Name the project "CocoaNotepad". You can choose any location you like. It's good to put all of your projects in one location, so ~/Development/CocoaNotepad might be a good choice.

Once you create the project, the main Xcode window appears. The Xcode window has several views you can switch between using the Page toolbar item.

This is the Project View. It lists files, search results, build settings, and more. Clicking the Build and Go toolbar item will compile your application and run it.

There's a dropdown in the toolbar labeled Active Build Configuration, initially set to Release.

This dropdown controls build settings. Release means that the application will be built as a finished product. The Debug setting builds quicker and gives more information to developers, but an application built with Debug cannot be given to users. You can leave this set to Release for now.

Unfold the CocoaNotepad group, then the Resources folder. Double-click the MainMenu.nib item to open it in Interface Builder.

Interface Builder is used by Cocoa programmers to lay out the user interface of an application.

The application window is where you place items that the user will see on screen.

The menu displays the contents of your application's menu bar. You can click on a menu item to select it, and double-click to rename it. To reposition a menu item, just drag it to a new position. To delete it, select it then press the Delete key.

The Library Palette contains stock items in Cocoa that you can add to your application via drag-and-drop. Open the Library Palette now using Tools → Library.

The document window displays the contents of the MainMenu.nib file itself. The user doesn't see this window in the application — it's only used during development. (Keep in mind that anyone can open an application's NIB file, though.)

The Library Palette has two tabs: Objects and Media. Objects are functional items like text fields, slider controls, and so on.

The Media tab contains presentation items, such as images and sounds. Items from both the Object and Media tabs can be dragged out and added to your application. For this tutorial, we'll focus on Objects.

Click on the top-level Library item then type "text view" into the search box at the bottom of the inspector window. This should display the NSTextView item object. Drag it out of the palette and onto your application window.

Place the text view near the top-left of the window, then resize it using the handles around the outside:

It should nearly fill the window, with a bit of space on the bottom. The exact size is not important.

Finally, we need to set the sizing attributes for the text view so that it keeps the same proportions as the window. Select the text view and choose Tools → Inspector, then click on the Size tab at the top of the inspector window.

The inspector window should say "Text View Size" at the top. If it says something else — such as "Scroll View Size" — select the text view again. You may have to click or double-click several times to get the correct item selected.

The bottom half of the size inspector contains a section labeled Autosizing.

Click the horizontal and vertical lines in the internal box so that they become solid red lines. The animated preview shows that the text view's internal size will grow and shrink with the window.

We'll use the Format menu to allow the application to use various fonts. First, though, we need to create an action to connect it to.

Select the red First Responder cube in the document window, then click on the Identity tab in the inspector.

Click the plus button under the Actions section to add a new action. Type in the name "orderFrontFontPanel:" then press the Return key to accept the change.

In your application menu, click the Format item to open its contents. Position the mouse over the Show Fonts item, then hold down Control and drag a connection to First Responder.

Remember, you must drag a connection from your application menu, not the menu in Interface Builder itself.

When you can see a connection between the two, release the mouse button and the Control key.

You will see a list of possible actions. Click the orderFrontFontPanel: item. The First Responder icon will blink briefly to confirm the connection has been made.

Switch back to Xcode, then build and run the application by pressing ⌘-R, or by simply choose Build → Build and Run.

Even though this project doesn't have a single line of custom code, you can see that we already have a working application. Choose Format → Show Fonts to choose a font and start typing.

It can't save files, but it uses Cocoa's built-in text view so you can use fonts, colors, international text, and spell checking. It also support drag-and-drop, text search, and many other features.

The application also supports printing and can create PDF files. To try this out, simply choose File → Print. Click Preview in the print dialog to convert the text to a PDF.

This document can be treated as any other PDF document, including text selection, searching and annotation.

The goal of this tutorial is just to give you a taste of what Cocoa has to offer. Even though we didn't write any code, we ended up with an application which has some very sophisticated text handling. The Xcode project is contained in the following zip file. If you'd like to see more tutorials like this, please make a donation. Please consider the download a thank you gift for your contribution.