iPhone tutorial 1 – basic button

I dislike doing “hello world!” tutorials, so instead I shall show you how to make a button! Buttons are more cool you see ;)

First go and get the iPhone SDK(Software Development Kit) from developer.apple.com
If you are on a windows PC, I’m afraid that you can not do this tutorial. The iPhone SDK is limited to Mac OS X based computers.

In theory you have the iPhone SDK installed and ready, so go launch Xcode. This is the default IDE (integrated development environment).

Make a new project
Xcode

Make a View based project and named it ‘button’
Screen shot 2010-05-07 at 09.15.23

Now you should see this
Screen shot 2010-05-07 at 09.16.05

This is one of the building blocks Apple give you to start making your very own iPhone app! Cool eh?

So go ahead and double click buttonViewController.h (it’s in the folder named Classes) in the left pane. This is where we will tell the iPhone what is what :)

Add the following line (in bold below) into in the file


#import < uikit /UIKit.h >

@interface buttonViewController : UIViewController {
// this is a label control, static text. Has no interaction with the user
IBOutlet UILabel *myLabel;
}

@property (nonatomic, retain) UILabel *myLabel;
// our button control :D
- (IBAction)buttonPressed:(id)sender;

@end

Now the .h file or header file is edited we need to now edit the .m file, so go open buttonViewController.m. You shall see a load of green commented text. These are the most common methods you need in day to day iPhone development.

All the commented code can be deleted, you only need the following (as before, bolded text is the code added).

#import "buttonViewController.h"

@implementation buttonViewController
@synthesize myLabel;

-(IBAction)buttonPressed:(id)sender{
myLabel.text = @”moo”;
}

- (void)didReceiveMemoryWarning {
// Releases the view if it doesn’t have a superview.
[super didReceiveMemoryWarning];

// Release any cached data, images, etc that aren’t in use.
}

- (void)viewDidUnload {
// Release any retained subviews of the main view.
// e.g. self.myOutlet = nil;
}

- (void)dealloc {
[myLabel release];
[super dealloc];
}

@end

Well that is it for the code, now the we go onto something called the Interface Builder. Find buttonViewController.xib in the folder Resources in the left pane of Xcode.

You shall see a grey rectangle
Screen shot 2010-05-07 at 09.17.19

let’s add some stuff to it eh?
Open the library if its not open already (shift + cmd + L) and add a label and a button. You don’t have to do anything else, but to edit the text in the button and the label, simply double click them and enter the text you want to show when the app is launched
Screen shot 2010-05-07 at 09.20.28

okay, now we need to hook up everything. Hold the control key on your keyboard and click on the “File’s Owner” file and drag to the label, and click “myLabel”.
Screen shot 2010-05-07 at 10.13.28
This is where the File Owner object hides.

Now with the button, there is a variety of ways to hook it up. The way I find easier is to right click it and then click on Touch Up Inside (it’s near the botton of the pop-up) and drag that to the File Owner object. Then click on buttonPressed.

That is it, click on “Build and Run” in Xcode and your iPhone emulator will be launched with your application installed. Click the button and see the label’s text change.
Screen shot 2010-05-07 at 10.14.45
If you have any questions, feel free to leave a comment :)

Tags: ,

Author:Alan Hamlyn

-- Alan Hamlyn Founder of Wuup
  • Bill Nunney

    Cool, yeah making buttons is way better than ‘Hello World’ tutorials. A button is something you can actually use :)

  • http://topsy.com/trackback?utm_source=pingback&utm_campaign=L2&url=http://www.wuup.co.uk/iphone-tutorial-1-basic-button Tweets that mention iPhone tutorial 1 – basic button — Topsy.com

    [...] This post was mentioned on Twitter by Alan Hamlyn, Tammy Kahn Fennell and JononFiredotcom, PieDog Media. PieDog Media said: RT @Wuup iPhone tutorial 1 – basic button http://bit.ly/do5CTD [...]

  • http://www.wuup.co.uk Alan Hamlyn

    Great tutorial, just read it through, thanks