Programming for iPhone: Introduction Pt 2

Tragic Eleven iPhone AppIn this article I will wrap up the creation of the Tragic Eleven Ball App. We will create a icon for your app and then I’ll give you all the code you need. If you missed the first article, go check out Programming for iPhone Pt 1 first!

Creating an App Icon

To create an icon for your new app, create a good representative of what your app does and save it as a PNG file. The dimension’s must be 57 x 57 pixel’s. You don’t need to round the edge’s or add a glare to the button. The iPhone software does that for you. Here is the one I made, to the left. Save it as icon.png.

I then save the PNG file in the main folder for my app. In this case it is in the Hello World folder. Then you locate the PNG file and inside of XCode drag and drop the image into your resources folder. The Resources folder can be found in your left sidebar, in the Groups & Files area.

Just like that you have a icon associated with your new app. If you double click on the file named Hello_World-Info.plist a pop up window will appear. On the fourth line down you can see that Icon File is now associated with your icon.


Build the App’s Interface in Interface Builder

Tragic Eleven iPhone AppHere is the finished iPhone app. When the person clicks on the button labeled “What Should I Do?”, it will display a random answer in the area where you see the word’s “Ask your Question.” To open Interface Builder, from inside of XCode, double click on the file named Hello_WorldViewController.xib. This will open Interface Builder.

Interface Builder Contains 4 Window’s

  • View: Is where you will drag the Label and Button element’s you need for your app. Think of this as your app’s screen
  • Library: Here are all of the pre-built element’s you can use for your app
  • Main: Named Hello_WorldViewController.xib. Here are all of the object’s and View’s that have been created for this app.
  • Attributes: Shows you all of the ways you can edit the element’s you drag on to the View window. It will populate with the element’s Attribute’s when you click on an element.

Now just drag a Label Element from the Library and type, “Ask Your Question”, in it. Drag a Button element into View and type, “What Should I Do?” Mess with the Attribute’s if you want. Now if you are done click File & Save in your top menu bar.

The iPhone Interface / Header File

Now we are going to add the code that is needed. To create the code needed first double click on the file named Hello_WorldViewController.h inside of the XCode program. A lot of code was created for you. Just add the code that is italic:

//

// Hello_WorldViewController.h

// Hello World

//

// Created by Derek Banas on 6/17/10.

// Copyright My Business Builders, LLC 2010. All rights reserved.

//

#import <UIKit/UIKit.h>

@interface Hello_WorldViewController : UIViewController {

// Creating the label we will later write to when the button is pressed

IBOutlet UILabel *answerToQuestion;

}

// Creates a way for you to both get and set the value of the label

@property (retain, nonatomic) UILabel *answerToQuestion;

// Tells the compiler we want to perform an action when the button is pressed

// The action to be performed is the calling of the method named buttonPressed

-(IBAction)buttonPressed: (id)sender;

@end

In the header file you define all the properties and capabilities that your implementation code will then specifically define. If you don’t know what the @interface or @implementation mean, go read my Objective C article.

As you can read in the comments. IBOutlet UILabel *answerToQuestion; Defines the name for the label. Don’t worry about exactly what all of this mean’s, I’ll cover that in the next article.

@property (retain, nonatomic) UILabel *answerToQuestion; tells the compiler that you want it to create a way for you to both retrieve and set the value or word’s found in the label named answerToQuestion. Much more on this later.

-(IBAction)buttonPressed: (id)sender; Tells the compiler that if the button is pressed we want the function named buttonPressed to be called and executed.

The iPhone Implementation File

In the implementation file or Hello_WorldViewController.m, you will create the function that is called when the button is clicked. You also we have the compiler create the function’s that will allow your code to set and receive the value of the Label element. Here is the code, again the code you need to add is italic:

//

// Hello_WorldViewController.m

// Hello World

//

// Created by Derek Banas on 6/17/10.

// Copyright My Business Builders, LLC 2010. All rights reserved.

//

#import <stdlib.h>

#import “Hello_WorldViewController.h”

@implementation Hello_WorldViewController

@synthesize answerToQuestion; // Create the label setting and getting function’s

// The function thats called when the button is clicked on

-(IBAction)buttonPressed:(id)sender

{

// Generate a random number between 0 and 5

int randomNum1 = arc4random() % 6;

// Check to see what random number was generated and post the appropriate string

switch (randomNum1) {

case 0:

//Change the text in the label

answerToQuestion.text = @”Will probably kill you”;

break;

case 1:

answerToQuestion.text = @”Likely to Contract Syphilis”;

break;

case 2:

answerToQuestion.text = @”You’ll Knock your Eye Out”;

break;

case 3:

answerToQuestion.text = @”If Dismemberment Sounds Good”;

break;

case 4:

answerToQuestion.text = @”Will Lose Control of Bowels”;

break;

case 5:

answerToQuestion.text = @”Do you Like your 2 Hands?”;

break;

default:

answerToQuestion.text = @”Don’t Do it Alone!”;

break;

}

}

/*

// The designated initializer. Override to perform setup that is required before the view is loaded.

– (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {

if ((self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil])) {

// Custom initialization

}

return self;

}

*/

/*

// Implement loadView to create a view hierarchy programmatically, without using a nib.

– (void)loadView {

}

*/

/*

// Implement viewDidLoad to do additional setup after loading the view, typically from a nib.

– (void)viewDidLoad {

[super viewDidLoad];

}

*/

/*

// Override to allow orientations other than the default portrait orientation.

– (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {

// Return YES for supported orientations

return (interfaceOrientation == UIInterfaceOrientationPortrait);

}

*/

– (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 {

// Give the memory you were using back to the computer

[answerToQuestion release];

[super dealloc];

}

@end

I think the comment’s are self explanatory. This code will set a random phrase to the Label based off of a random number generator. int randomNum1 = arc4random() % 6; is a function used to generate a random number between 0 and 5.

Back to Interface Builder

Now you need to open Interface builder, by double clicking on Hello_WorldViewController.xib. Now do the following:

  • Right click on the Label, you will see a gray box open with the word’s “answerToQuestion” and a open dot to the right of that phrase. Click and drag that dot into the Main window to the File’s Owner icon. It look’s like a transparent cube.
  • Right click on the Button element, and do the same
  • Click file and save this file and open XCode.

You just connected the interface to the code you wrote, so that the interface knows what code to execute based off of what the user does.

If you click on the Build and Run button in the top of the screen, the Tragic Eleven app will run. Prepare for all kind’s of bad advice.

If you have any question’s leave them below. Over the next few article’s I will continue making more and more complicated iPhone / iPad app’s. If you want to see something specific comment below.

Here to Serve

Think Tank

Leave a Reply

Your email address will not be published.

Google+