by Amber Weinberg
This article is a general overview of making iPhone apps using the iPhone software development kit (SDK).
In order to start making your own iPhone apps, you’ll need to sign up for a free Apple Developer account and download the iPhone SDK.
What’s the iPhone SDK?
Apple has bundled a ton of great resources into a mega 2GB download that contains help files, documents and three very important apps: Xcode, Interface Builder and iPhone Simulator. All of these apps also work for the creation of iPad apps.
Let’s take a quick look at the three apps and see what they do.
It’s similar in interface to the popular Coda IDE for website development, but it’s much, much more powerful since it’s built to specifically handle Objective-C (the programming language used on Mac OS X and iOS) and Cocoa (Apple’s development framework).
When coding, you’ll find that Xcode offers code completion and hints that can greatly speed up your development time. Typing in 3 or 4 characters will often result in Xcode choosing the right method or option you’re trying to type and even remembers classes and object names you’ve created. Xcode also comes with documentation that can be accessed by pressing the Option key and doubling-clicking on the methods.
Xcode offers different project types depending on the kind of app you’re planning on building. Projects are the files and resources that make up your app and they’re bundled together by the SDK. Most of them never need to be edited, but are required for the app to run.
Starting a New Project in Xcode
If you go to File > New Project (Shift + Command + N), you’ll see the different project types that Xcode offers.
The View-Based Application option is probably the most common type for beginners. Select it, hit the Choose button and then give your project a name and a place to save it.
Choosing a project type allows Xcode to build and link the core files and resources together.
The left-hand column is called the Groups & Files pane. The Groups & Files pane contains all of the files and resources that were created when you selected the View-Based Application project type.
If you expand the tree underneath the name of your project (using the triangle), you’ll see that there are five folders contained underneath it. Let’s go over what these folders are.
Classes folder: Most of the time, you’ll be using the files contained within the Classes folder. The Classes folder simply contains all of the Objective-C classes you’ll be creating. The two most important files you’ll be editing are called
Other Sources folder: This folder contains all of the classes that aren’t in Objective-C.
Resources folder: The Resources folder contains all the files, images, sound files, movies, etc. that belong to your app. Any resource you want to use within your app has to be placed here while in test mode unless you’re using the iPhoto or Address Book APIs. This folder also contains your
your_project_name_ViewController.xib file. Doubling-clicking this file opens up Interface Builder, allowing you to begin seeing what the user sees (more on this topic later down the article).
Frameworks folder: The Frameworks folder can contain both code and resources and common frameworks that are already included.
Products folder: The Products folder contains the actual app that is produced when you compile your project. If you expand this folder without having compiled your project, you’ll see
you_project_name.app in red because it won’t exist.
Xcode’s Detail Pane and Editor Pane
In the right-hand column, you’ll see we have two different panes. The top pane is called the Detail pane and it shows you information about the files inside Groups & Files. You probably won’t use this pane very often, so you can minimize it some by clicking and dragging up the bottom portion.
The pane beneath the Detail pane is the Editor pane. This is where all your coding happens! If you click one of the files under your Classes folder in the Groups & Files pane, the file will appear in the Editor where you can then work on it.
Now that we’ve taken a tour of Xcode, let’s check out the second most important app: Interface Builder.
One of the coolest things about iPhone development is that making the apps requires a lot less code than you would think, thanks to the Interface Builder.
Open Interface Builder by double-clicking the
your_project_nameViewController.xib file under the Resources folder in the Groups & Files pane of Xcode. Interface Builder opens as a series of four windows.
You can think of the Interface Builder as sort of a visual WYSIWYG for the iPhone, but it’s much more than that. It never produces ugly code, and in fact, you’ll never see the code. It’s also built with Apple’s design guidelines and grids to ensure you’re app doesn’t come out as the ugly stepchild!
The Library window gives you all the views and controls that you can simply drag and drop onto your interface (the module marked as “Window”).
The Inspector window is where all of your settings and controls lie. This window actually contains four different views that you can access by clicking one of the top icons or by pressing Command + 1-4 to access each view.
Attributes: The first window shows the object’s attributes. You can change fonts, colors and sizes from this window.
Connections: shows the available ways you can connect the object to an action. For example, buttons have a ton of connections such as Touch Up Inside and Touch Drag Outside that all correspond to how a user may interact with your object.
Size: The Size window allows you to adjust the size, alignment and positioning of the object on the window. This view will be most helpful when dealing with repositioning of the app due to horizontal and vertical views (rotation of the iPhone).
Identity: This view is less used than the others but it gives you the ability to set class names, as well as what the object is and does.
Other Important Features of Interface Builder
The smaller window marked
your_project_nameViewController.xib contains icons that represent each Objective-C class that was created when you started a new project — with the exception of the first two icons.
The first icon — File’s Owner — represents the object that loaded your .xib file (which is commonly referred to as a “nib” file — confusing, I know).
The First Responder icon represents the object or control the user is interacting with — for example, a text field or a button.
The coolest thing about Interface Builder is how it connects to Xcode. After you’ve coded your objects and actions in Xcode, you’ll switch over to Interface Builder to create what the user actually sees.
Then, to connect the objects in Interface Builder to what you’ve coded, you simply Command + click and drag from the File’s Owner icon in the Untitled Window to the object to assign it. You can also do the same to assign an action to the button.
The iPhone Simulator does just what it promises — it gives you a realistic simulator of how your app will look and work on a real iPhone. It even allows you to hit the Home button to view the app’s icon.
You can also use the simulator to view apps on the iPad and even to open Safari and view websites on.
Testing on a Real iPhone
If you want to use a real iPhone to test on, you’ll need to pay Apple’s Mac Developer Program membership fee. An Apple Developer account is free, but in order to put your apps on your own iPhone or sell it in the Apple Store, you must sign up and pay $99 for the privilege.
Further Reading on iPhone Apps
Now that you’ve taken a tour of the SDK, it’s time to start building apps! I’ve been using a ton of resources to help me learn more about the process, so I’d thought I’d share a few of my favorites with you here.
Beginning iPhone 3 Development by Dave Mark
This is an excellent book for beginners. The apps work (no code errors) and it’s easy to follow along even if you have no Objective-C experience.
This is a video podcast offering tutorials and topics on Mac and iPhone development.
I tend to skim through these posts quickly, but they often have interesting topics.
Rework and Getting Real by 37signals
While not specifically about iPhone apps, these two books can inspire you in the business side of making apps, launching your projects well, and development practices.
Have you used the iPhone SDK before? What are your thoughts on it? Do you have any excellent beginner resources to share?
- How to Make an HTML5 iPhone App
- 10 iPhone Apps Every Web Designer Should Know About
- 20 Killer iPhone Game Designs
- Related categories: Web Development and Tools
About the Author
Amber Weinberg is a freelancer with over 10 years of experience. She’s the founder of codesnipp.it, a social site for developers. She specializes in clean, semantic and valid 1.0 Strict XHTML, CSS and WordPress development. She also writes a web development blog on her portfolio site at www.amberweinberg.com.