Example code programming Objective-C with Cocoa in Xcode and Interface Builder (Leopard)

1: Example: Button

Implementing a simple button

The example is presented in two formats: Concise Text which has no illustrations and Illustrated Text. The reason is that I frequently found illustrations to get in the way of learning.
A 2.3MB .zip file of this OS X 10.5 Leopard program may be downloaded by clicking here. All the text and example code is licenced under GPL.

Concise Text (Illustrated text is below)

Create a new project in XCode: File->New Project->Cocoa Application.
Call it: ButtonApp.
Next do: File->New File and choose Objective C Class.
Call the files DoButton.h and DoButton.m, code them as shown below and save. Note that the file is subclassed as NSButtonCell.

// DoButton.h #import <Cocoa/Cocoa.h> @interface DoButton : NSButtonCell { } - (IBAction)doSomething:(id)pId; @end // DoButton.m #import "DoButton.h" @implementation DoButton - (IBAction)doSomething:(id)pId; { NSLog(@"Hi there"); } // end doSomething @end

Now bring up Interface Builder by double clicking on MainMenu.nib in the Resources section of ButtonApp

Drag a Round Rect Button onto the Window.
Choose DoButton from the Class menu in the Inspector

Choose the Connections display in the Inspector and drag from the connection circle next to the Action 'doSomething' to the button you dragged onto the window.
You will see a label pop-up that says 'Round Rect Button'.
Let go the mouse button and the display will change to show the link.

Save Interface Builder.
Return to XCode. Choose Run->Console. Now Build and Run.
When you click the button you will see 'Hi There' appear in the Console log.

Illustrated Text

Create a new project in XCode: File->New Project->Cocoa Application.
Call it: ButtonApp.
Next do: File->New File and choose Objective C Class.
Call the files DoButton.h and DoButton.m, code them as shown below and save. Note that the file is subclassed as NSButtonCell.

// DoButton.h #import <Cocoa/Cocoa.h> @interface DoButton : NSButtonCell { } - (IBAction)doSomething:(id)pId; @end // DoButton.m #import "DoButton.h" @implementation DoButton - (IBAction)doSomething:(id)pId; { NSLog(@"Hi there"); } // end doSomething @end

Now bring up Interface Builder by double clicking on MainMenu.nib in the Resources section of ButtonApp

Interface Builder, button, and class identity

Interface Builder showing the window with button and Inspector

Drag a Round Rect Button onto the Window.
Choose DoButton from the Class menu in the Inspector

Interface Builder, button, and linking action to button

Interface Builder showing linking action with button

Choose the Connections display in the Inspector and drag from the connection circle next to the Action 'doSomething' to the button you dragged onto the window.

You will see a label pop-up as shown in the picture above.
Let go the mouse button and the display will change as shown.

Interface Builder showing link of action with button

Interface Builder showing link of action with button

Save Interface Builder.
Return to XCode. Choose Run->Console. Now Build and Run.
Cick on the button and you will see 'Hi There' appear in the Console log.

Download the code

Click the Download Link to obtain 001-ButtonApp.zip file of this whole OS X 10.5 Leopard program.

Download 001-ButtonApp.zip (2.3 MB)



Please send me your comments

If you include your e-mail I may reply!  

Page last modified: 18:58 Sunday 12th. May 2013

Julius Guzy

Paintings & Drawings

  • Link to drawing made from painting by Rubens of the Feast of Venus

animatedPaint