Well, you got yourself a Macintosh, an iPhone and you’ve registered yourself as an Apple developer, what to do now ?
The biggest hurdle for me when starting developing for the iPhone was the Interface Builder, i could not connect my interfaces to my controllers, so I thought I could give you a brief introduction on how to set it up.
Lets make a simple calculator, start with firing up XCode, and create a new project, select iPhone application and select the View Based Application, click choose and give it some name;

Then you will be presented with the default XCode view, you can see that XCode has created some files for us to get started, there are mainly three files we need to mention, you have the ViewController.h and ViewController.m files which are the, you guessed it, viewcontroller, the .h file is the headerfile and the .m file is the implementation. The next file we will take a look at is the ViewController.xib file which is the interface we shall use for our calculator, double click it and it will open in Interface Builder, it will look something like this;

Open up the Inputs & Values folder in the library window and drag the Round Rect Button and drag it onto the View, you’ve created a button! You can use the inspector to give it a text and change its parameters, drag some more buttons and a Label over to create a simple calculator UI, mine looked like this;

Save the file and return to XCode, and double click the [YourProjectName]ViewController.h file, it should contain something like this;
#import
@interface BlogProsjektViewController : UIViewController {
}
@end
Start with adding some actions, an action is defined on this form;
- (IBAction) btnOne:(id) sender;
Add one for each button, your headerfile should contain this now;
#import
@interface BlogProsjektViewController : UIViewController {
}
- (IBAction) btnOne:(id) sender;
- (IBAction) btnTwo:(id) sender;
- (IBAction) btnThree:(id) sender;
- (IBAction) btnFour:(id) sender;
- (IBAction) btnFive:(id) sender;
- (IBAction) btnSix:(id) sender;
- (IBAction) btnSeven:(id) sender;
- (IBAction) btnEight:(id) sender;
- (IBAction) btnNine:(id) sender;
- (IBAction) btnDiv:(id) sender;
- (IBAction) btnMul:(id) sender;
- (IBAction) btnAdd:(id) sender;
- (IBAction) btnSub:(id) sender;
- (IBAction) btnClear:(id) sender;
@end
Hit Command+b to build it, you will get some warnings, but do not worry about those, then you can hit Build and Go(Command+Enter) to see the app in the simulator;

But our buttons does not do anything when we press them, lets do something about it!
Go back to the interface builder again and press Command+2 to bring up the connections inspector, and select a button, then drag from the Touch Up Inside event to the File’s Owner object in the Document window and select the appropriate action;

Do this for all the buttons, click save and return to XCode, now when we press a button, the respective functions in the ViewController will be run, but we need a connection for our display, now in the header file, add a IBOutlet for your display;
It should look like this;
#import
@interface BlogProsjektViewController : UIViewController {
IBOutlet UILabel *mydisplay;
}
@property(nonatomic,retain) IBOutlet UILabel *mydisplay;
- (IBAction) btnOne:(id) sender;
- (IBAction) btnTwo:(id) sender;
- (IBAction) btnThree:(id) sender;
- (IBAction) btnFour:(id) sender;
- (IBAction) btnFive:(id) sender;
- (IBAction) btnSix:(id) sender;
- (IBAction) btnSeven:(id) sender;
- (IBAction) btnEight:(id) sender;
- (IBAction) btnNine:(id) sender;
- (IBAction) btnDiv:(id) sender;
- (IBAction) btnMul:(id) sender;
- (IBAction) btnAdd:(id) sender;
- (IBAction) btnSub:(id) sender;
- (IBAction) btnClear:(id) sender;
@end
Now save the file and switch back to interface builder, and select the label, press Command+2 and drag from the New Referencing Outlet to the File’s Owner object and select mydisplay in the popup.

Now hit save, and switch back to XCode, we’re pretty much done with interface builder now, so you could infact close it, but if you want to tweak your UI you could just leave it open.
Now open your [YourProjectName]ViewController.m, and for each action in the header file you want to make a function similar to this;
- (IBAction) btnOne:(id) sender{
}
Hit save and build it, it should compile just fine. Now, in the top of the file, right under the
@implementation
statement, add;
@synthesize mydisplay;
and build, now it should compile without any warnings.
What this does, is take the property defined in the header file into the scope of the implementation file.
Go to the btnOne function and add this to it;
- (IBAction) btnOne:(id) sender{
NSString *testtext = @"Button one pressed";
mydisplay.text = testtext;
}
Now when we press button one the text in the display should change, hit Command+Enter and check it out;

Now, lets implement the logic, i have to state that this implementation will be very simple, it accepts two numbers with a operation between it, so lets define a variable for the two numbers,
float one;
,
float two;
and a integer for the operation
int operation;
So the calculator should work like this;
1. Enter a number
2. Enter an operation
3. Enter a second number
4. Get result
So lets define a function called,
addOperand
, it should look like this;
-(void) addOperand:(float)op{
if(operand == -1){
one = op;
}
else{
two = op;
}
}
You must allso not forget to add it to the header file;
-(void) addOperand:(float)op;
And for each of the number-button-events add this;
[self addOperand:1.0f];
And dont forget to change the number according to which button you are working with, now we can set the two operands, but when the second operand is added we need to calculate and display the result, so lets add a function for that, lets call it sumResults;
-(void) sumResults:(int)op{
float result;
if(operand == -1){
//do nothing
}
else if(op == 1){//plus
result = one + two;
}
else if(op == 2){//minus
result = one - two;
}
else if(op == 3){//multiply
result = one * two;
}
else if(op == 4){//divide
if(two != 0){
result = one / two;
}
}
NSString *output = [[NSString alloc] initWithFormat:@"=%f",result];
mydisplay.text = output;
}
Now in the add operand we need to call it whenever the second operand is added;
-(void) addOperand:(float)op{
if(operand == -1){
one = op;
}
else{
two = op;
[self sumResults:operand];
}
}
Now lets just quickly define the operand buttons and the clear button,
as we can see from the sum results function, the operand buttons sets the operand to 1,2,3 and 4 for , add, sub,mul and div.
- (IBAction) btnAdd:(id) sender{
operand = 1;
}
- (IBAction) btnSub:(id) sender{
operand = 2;
}
- (IBAction) btnDiv:(id) sender{
operand = 4;
}
- (IBAction) btnMul:(id) sender{
operand = 3;
}
The clear function should clear out the numbers and the operator and the display;
- (IBAction) btnClear:(id) sender{
operand = -1;
one = 0.0f;
two = 0.0f;
mydisplay.text = @"";
}
Now hit Build and Go and test it out, it should compile just fine.

There you go, a simple calculator, you can try to expand it with fancy features, but the main lesson to be learned here is how to connect your UI to your logic!
Leave a comment if you have any questions!
PS! You can pick up the project files here: http://grande.cc/BlogProsjekt.zip