What will you learn?

• Tools: how to use XCode 4.2 to create a new iPhone application, how to add a new class file and how to create your own view class. Using XCode to create the UI: drag and drop, inspector tabs, custom classes, connecting graphically objects, outlets and actions.
• Programming: practical examples of implementing the Model View Controller design pattern, outlets and actions, member variable naming conventions, forward class declaration, deriving classes, and overriding methods.
• Frameworks: UIKit concepts: creating a custom UIView by overriding drawRect, and the use of needsDisplay and needsLayout. Core Graphics concepts: context, path, current position, adding to path, stroke, fill.

Prerequisites

• You need an Intel based Mac. Unfortunately iOS development cannot be done on a PC or on a Linux machine.
• You need to have at least some basic programming experience, preferably in an object oriented language. To understand Objective C is useful to read the language guide here.
• Download and install the latest iPhone SDK from here. For this you will need to  become a Registered iOS Developer with Apple’s iOS Dev Center.

Note: The SDK is a free download for any registered iPhone developer, and you do not need to join (yet) the iOS Developer Program which costs $99/year. You may want to join the iOS Developer Program later when you decide to try your applications on real devices (iPhone, iPod Touch or iPad), but for now you can try everything on the iPhone/iPad Simulator which runs on your Mac.

Tutorial

We will create a small application with a custom made view that displays a regular polygon with a variable number of vertices (between 3 and 20). The application will also display the number of vertices, and will allow the user to change the number of vertices by moving a slider control on the screen.

Step 1 – Create a new project called Polygon

1. Make sure that the latest iOS SDK is installed, and launch XCode.
2. Select the menu “File/New/New Project…”.
3. On the left column of the New Project dialog select “Application” under the “iOS” section title. In the right window select “Single View Application”. Press “Next”.



4. Type “Polygon” as the Product Name, select “iPhone” for Device Family, make sure “Use Storyboard” is not checked and “Use Automatic Reference Counting” is checked. Press “Next”.



5. On the next screen choose where you want to create your project and press “Create”

Note: Use the exact spelling and case for the project name, so you can just copy and paste code later in the tutorial.

Build and run the application by pressing the Run button on the left of XCode’s top toobar. You should get no errors and the screen should show a gray view taking over all the iPhone screen except for the status bar.

In the next step we will implement a custom view class that can draw a polygon on the screen.

Step 1 – Show the World Map

1. Create a new iPhone OS project: a Navigation based Application called “MapDemo”.
2. Remove the RootViewController.xib file from the project (choose “Also move to trash”).
3. Change the base class of the RootViewContoller in RootViewController.h to UIViewController.
4. Add the MapKit framework. Click the Project->Edit Active Target “MapDemo” menu. From the Target Info dialog choose the General tab, and click the “+” button on the bottom. Select the MapKit framework and add it.
   
5. Double click to open MainWindow.xib in Interface Builder. Set the nib window to list view mode, expand the tree and select RootViewContoller.
   In the Attributes Inspector window remove the NIB name.
6. In the MainWindow.xib window select Navigation Controller, and in the Attributes Inspector uncheck Shows Navigation bar.
   
7. Drag and drop a map view on top of the Navigation Controller view.
   
8. Save, compile and run.