Cocoa Is My Girlfriend » Cocoa Touch Tutorial: iPhone Application E...http://www.cimgf.com/2008/10/01/cocoa-touch-tutorial-iphone-applica... Cocoa Touch Tutorial: iPhone Application Example by Matt Long | October 01st, 2008 Similar to one of my first blog posts on building a basic application for Mac OS X using xcode 3.0, I am going to explain for beginning iPhone/iPod Touch developers how to build the most basic Cocoa Touch application using Interface Builder and an application delegate in xcode 3.1. This tutorial post is really to provide a quick how-to. I won’t go into any depth explaining why things are done the way they are done, but this should help you get up and running with your first application pretty quickly so that you too can clog the App Store with useless superfluous apps (kidding… just kidding). If you are a visual learner, it may be helpful to you to instead watch a video presentation of this tutorial. I’ve posted it on the site, but you’ll have to click the link to see my Cocoa Touch Video Tutorial. Understanding Cocoa programming is much simpler if you learn MVC, Model, View, Controller. You can probably step through code examples and figure some things out without learning MVC, but I wouldn’t recommend it. Go Google it and read up on it. I will say as an introduction to MVC for those who are not familiar that it should probably be called (Model <--> Controller <--> View) or (View <--> Controller <--> Model) as the controller always sits between the other two. Your controller is either telling your model to update its data or it is telling the view to update its display. That’s the crux of the whole paradigm. The details run much deeper, but that’s how I will nutshell it for you. Create Your Application Let’s get started. Create a Cocoa Application using the following steps: 1. Select File > New Project…, under the iPhone OS templates choose Window-Based Application in the ensuing dialog. Click Choose… 2. Enter ‘Basic iPhone App’ as the project name. Click Save You should see a project workspace like the following: 1 de 5 12/04/2010 09:25 (void)applicationDidFinishLaunching:(UIApplication *)application { 2 // Override point for customization after app launch 3 4 [window makeKeyAndVisible].. Add the click: action below our applicationDidFinishLaunching: function: 1 . Delegate == Controller The words delegate and controller can be used synonymously. the action code will be run when the user clicks the button. .. 4 IBOutlet UILabel *label.h. but for the sake of brevity and walking you through the steps to build your first application.(IBAction)click:(id)sender. 2 de 5 12/04/2010 09:25 . The next thing you should do is create a class to act as your controller or delegate. http://www. When connected to a button for instance. 5} You will also want to add an action that will be performed when our button is clicked. In the iPhone template projects. the definition will have to suffice.m. Add that below the property for our window: 1 2 3 4 5 6 7 8 9 @interface Basic_iPhone_AppAppDelegate : NSObject <UIApplicationDelegate> { IBOutlet UIWindow *window. Now switch over to the implementation file. Action are functions in your code that are connected to controls in your user interface such as a button or a drop down list. } @property (nonatomic.com/2008/10/01/cocoa-touch-tutorial-iphone-applica. IBOutlet UITextField *textField. 3 IBOutlet UITextField *textField. IBOutlet UILabel *label. In xcode. this application delegate is created for you.. retain) UIWindow *window.Cocoa Is My Girlfriend » Cocoa Touch Tutorial: iPhone Application E. In our app delegate class we need to add what Cocoa developers refer to as outlets and actions.cimgf. You’ll see later that we delegate the work of the different controls we create in Interface Builder to a delegate or controller class. open your app delegate header file Basic_iPhone_AppAppDelegate. I could spend an entire post explaining these two things in depth. Add an outlet for the text field and the label below the window outlet as in the following snippet: 1 @interface Basic_iPhone_AppAppDelegate : NSObject <UIApplicationDelegate> { 2 IBOutlet UIWindow *window. Basic_iPhone_AppAppDelegate.. Outlets represent controls in your user interface that can have some action performed upon them. Our app delegate has been named Basic_iPhone_AppAppDelegate. } . We will actually add some code to do something in the click: action handler. you will see these items available for connecting to the UI in Interface builder. but first we need to hook it up to the user interface in Interface Builder.. a Label.. you will notice that there is an object representation of our app delegate in the MainWindow. 2. { } http://www.. Once Interface Builder loads.xib’. Note:: A . To finish the interface. This is the object you will use to create connections for your actions and outlets.(IBAction)click:(id)sender. complete the following steps: 1. Drag a TextField.Cocoa Is My Girlfriend » Cocoa Touch Tutorial: iPhone Application E.cimgf..xib is a . and a Button to the main window so that the user interface looks like the screenshot below: 3 de 5 12/04/2010 09:25 .xib window. This will open the xib file in Interface Builder 2. expand the folder in the tree view called Resources and double click the file called ‘MainMenu.com/2008/10/01/cocoa-touch-tutorial-iphone-applica. Make sure that the Object Library is open by selecting Tools | Library from the menu in Interface Builder. Interface Builder And Controller/Delegate Implementation Now that you’ve specified the outlets–a UITextField and a UILabel and an action called click:.nib that uses XML for the internal data structure. Let’s open Interface Builder and make the connections we need using the following steps: 1. In your xcode workspace. Design The User Interface Now you need to add the controls to the main window in Interface Builder and then we can connect the action and outlet accordingly. 4 5 6 7 8 9 10 [window makeKeyAndVisible]. .. 4 de 5 12/04/2010 09:25 .com/2008/10/01/cocoa-touch-tutorial-iphone-applica. http://www. Control-Click and drag from the Button to your app delegate object in the ‘MainWindow. Control-Click the app delegate object and drag it to the label in the main window.xib’ window. Select click: 4. A pop-up will display. 3. Select textField 5. A pop-up will display.cimgf... Control-Click the app delegate object and drag it to the text field in the main window.Cocoa Is My Girlfriend » Cocoa Touch Tutorial: iPhone Application E. 5 de 5 12/04/2010 09:25 . That’s all the application does.(IBAction)click:(id)sender. When the application runs the iPhone Simulator will be started.m file look like this: 1 .-) ... Conclusion The limit with iPhone development is really just your imagination. Here’s the code you need. Now all you need to do is click “Build and Go”. and setting the text in our label with it. Have fun with it and learn as much as you can... Just do me a favor and don’t clog the App Store with any more flashlight apps or tip calculators… Seriously . take a look at Apple’s. Type some text into the text field and click the Change button. Until next time. For a more in-depth path to gaining a deeper understanding of iPhone development. Just make your implementation of the click: action in the Basic_iPhone_AppAppDelegate.com/2008/10/01/cocoa-touch-tutorial-iphone-applica. You can quit interface builder and return to xcode. Next Steps This tutorial has just scratched the surface. Your First iPhone Application. You will see the application load.Cocoa Is My Girlfriend » Cocoa Touch Tutorial: iPhone Application E. Select label That’s it for Interface Builder. http://www. You will need to log in with your ADC account to see the article.cimgf. but it is definitely worth while. A pop-up will display. It’s is intended to get you going quickly. 2{ 3 [label setText:[textField text]]. 4} Notice we are grabbing the text from the text field. It is an extremely fun platform to develop on and the resulting applications are very rewarding. We have one more piece of code to add and then our application will be finished. Finishing Up When the button is clicked. You will see the label update with the text from the text field. it will simply grab the text from the text field and place it into the label.