As we go through the semester I will periodically try to fix the
terminology I use for things.
One pair of words which we will use a lot and that are often confused is simulator and emulator.
A simulator typically creates an environment via shared libraries that is like the environment
of the mobile phone but which is running the machine code of the desktop.
An emulator is a program which actual reads the machine code for the target device and executes
it in an environment on the desktop that looks like the device.
For iPhone development we use a simulator; for Android we use an emulator.
Creating a Project
At this point I assume you have downloaded XCode from the Mac App Store.
This actually gets you an Install XCode.app as well. You use this in the future any time
you want to update XCode.
Launch XCode, select Create a New Project.
To create a simple new project, go to File > New Project.
Select Single-View Application and give it a name.
XCode Project Window
More on Each Part of IDE Window
Toolbar -- the top part of the workspace window.
Left hand side has tools for starting, stopping project, and a pop-up to select a scheme for target and build setting.
Next to this is the activity view which displays any actions of processes that are currently happening.
Next in the toolbar there is a group of three different editor configurations: standard view -- which generally has a single pane used to edit a file, assistant view which splits the editor pane into a left and right (one might show source the other the header file), and versions view that has time machine features
The Organizer button has different nonproject-specific functionality such as viewing the API documentation.
Navigator View -- the left hand pane of the project, can be used to display the files in the project (project navigator), the symbols in the project (symbol navigator), searches on the files (search navigator), issues related to the build (issues navigator), debug information (debug navigator), breakpoints (breakpoint navigator), and log messages (log navigator).
Editor -- If you select a single file in the project navigator, and you are in standard view, and XCode knows how to display the file, then it appears in the editor pane in the center of the XCode Window. Right above this is the Jump Bar that allows you to go forward and back through files as well as to see and click on parts of the path to the current file.
XCode 4 versus Earlier
Prior to Xcode 4, there was a separate program for editing user interfaces called Interface Builder. This is now into the workspace itself as we will see.
Before Xcode 4, code for iOS was compiled using gcc, starting with Xcode 4 a new compiler called LLVM 3
is used.
This is a open-source compiler project originally started at the Urbana-Champaign 2000 and uses a BSD-license. Like GCC it can target different languages one of which is Objective-C.
Supposedly, LLVM produces faster code that gcc and can generate better error messages and warnings.
A Simple Project
A bunch of resources will be automatically created for you in the Navigator Pane when you create a new project:
Name-of-Project Folder -- The first folder in your project is always named after the project. This is where the code that you write will go (Objective-C). You can do what you like in here -- add files and sub-folders. You should notice in this folder there are two files: MainStoryboard_iPhone.storyboard, and
MainStoryboard_iPad.storyboard. These specify the interface of the project -- when you create a single-view application it gives a checkbox to allow you to select whether you
want to use storyboards or the old style XIB files.
Supporting Files -- This folder is created for you within the Name-of-Project folder. For now we won't need to change much here. When we create a project as above it will contain
a .pch file (pre-compiled header) for your project and a main.m file, a properties list and a strings file for localization.
Name-of-ProjectTest Folder -- This contains test cases you write while writing your code.
Frameworks -- libraries which may contain code as well as resources that could be used by our project. Most of the standard frameworks are included in our project by default, so for we don't have to add anything here.
Products -- contains the application that this project produces when it is compiled.
Quiz
Which of the following is true?
iPhones do not have RAM memory; they only use Flash memory.
Only two screen sizes are allowed for Android devices.
iOS is based on Unix and Android is based on Linux.
Interface Builder
To see the integrated Interface Builder of xCode 4.2 we can double-click on the MainStoryboard_iPhone.storyboard file.
More on Interface Builder
You can develop interfaces for the iPhone either directly in code, or using the Interface Builder.
For example, in code, you can generate a button by having a line like: UIButton *myButton = [[UIButton alloc] initWithFrame:aRect1]
If you go to View - Utilities - Show Utilities, the assistant view for interface builder shows up and you get a palette of things you can drag onto your view.
For example, you could select a button, and drag it to where one wants on the View. Clicking on the button you could then add text to it.
Interface builder has been around since the late 80s. Originally, the files edited by Interface Builder were called .nib files. Now Interface Builder supports .nib and .xib (XML-based) files; however, often people call both kinds of files "NIB" files.
The leftmost pane is the nib files main window. Here's what will have been created for us in this Window:
File's Owner -- the object that "owns" this copy of the NIB file. We'll say more about this later.
FirstResponder -- again a fuzzy concept for now -- the object with which the user is currently interacting.
Everything else in this window -- objects that will be created when the NIB file is created. In our case, we get an Icon View. This object is really a subclass of UIView. Clicking on this line will open up
what we have put on the View.
Setting Attributes of a UI Component
To make labels, buttons, etc more interesting, we often want to style them. i.e., we want to set a bunch of the attributes that are used when drawing them.
To do this we can go to View - Utilities - Show Attribute Inspector.
This will pop-up a window that will let us set these attributes.
Compiling Our Program
To compile our program we simply click on the Run icon in Xcode.
This will launch the iPhone simulator with our program running.
Changing the Application Icon
The icon used in iPhone Home Screen for your project is by default a white square.
To change this, we need to create an 57x 57 pixels .png file of our choice say my-icon.png and
then we create another icon with is 114 x 114 pixels (for retina displays and iPad) called my-icon@2x.png
and we put them in the Name-of-Project Folder in the Navigator Pane.
Finally, we click on Name-of-Project-Info.plist, CTRL-click and add a new row with key Icon Files (iOS 5). Finally, type in as values for the item 0 under Primary Icon and Newsstand Icon the names of the files you just added.
Creating an Android Program
Assuming you have downloaded the SDK and installed the Eclipse Plug-in.
Go to File > New > Android Project
Fill-in a project name: Hello
You will be given the option to choose a project target: For now, choose Android 4.03.