Basic iPhone UI Elements
by Paul Avery
Introduction
Since this is the first iPhone article published on CodeGuru, I thought it best to start from the very beginning. This article will address the creation of a new project from scratch and interaction with the following basic iPhone UI elements.
- UIView
- UILabel
- UITextField
- UIButton
- UIAlertView
However, in order to proceed any further, there is a basic level of understanding needed of Cocoa Touch. It is primarily Objective-C, which is C with an object-oriented flavor. It’s syntax can either be bracket based or dot based. Dot syntax was added with Objective-C 2.0 and will be more familiar to those coming from a .NET background. For the most part, I will stick with the dot syntax.
If you know absolutely nothing about about anything C based, I highly suggest you visit http://cocoadevcentral.com/d/learn_objectivec/ before proceeding any further.
// bracket syntax [imgView setImage:myImage]; // dot syntax imgView.image = myImage;
Creating a New Project
Apple is very big on “out of the box” solutions. Using Xcode and Interface Builder is no exception. When starting a project from scratch, most options will automatically add the main UIWindow and primary UIView element for you.
So, let’s begin. Start by selecting “New Project…” from the “File” menu. You will see a dialog like the following image. Select “View-based Application” and click “Choose…” After that, you will be allowed to name your project. For simplicity sake, I named mine “Basic.”
Now, you should have your created project with 2 main class files: BasicAppDelegate.h/m and BasicViewController.h/m. Your project should also include 3 main resource files: MainWindow.xib, BasicViewController.xib, and Basic-Info.plist. There are other files in your project, but we will concentrate on just these 5 for now. Files with a .h/m extension are classes, .xib are interfaces, and .plist are property lists.
BasicAppDelegate.h/m is the first class referenced. It controls the MainWindow.xib interface and subclasses the primary view controller. BasicViewController.h/m controls BasicViewController.xib which is the primary view that is displayed. This class will be where we focus our attention for majority of this project.
Property List
Before proceeding any further, we need to change some settings in the Basic-Info.plist property list. Typically, you will want to have the Bundle identifier include your company name. Also, remember that version incrementing and icons are controlled using this file. However, those aren’t the only settings this property list handles.
