In this chapter, you will learn how to download, set up, and install the Xcode development tools and Software Development Kit (SDK). You will also learn what the Xcode IDE is and how you will be using it. This will introduce you to the development environment and the space you will be working on most of the time while you are developing.
In this chapter, we will cover the following topics:
Becoming an Apple developer
Becoming an iOS developer
Downloading and installing Xcode
The Xcode IDE
Opening Xcode for the first time
The Xcode workspace
Before you can begin building apps and games for the iPhone, you will need to become a certified Apple developer, which gives you free access to Apple's developer website, programming tools, tutorials, documentation, and much more. As a certified Apple developer, you are able to create apps and games for Mac, Safari, and iOS.
Apple requires you to register as an Apple developer first. The registration is free and provides you with access to all of the tools and the iOS SDK required to develop apps for iPhone and iPad. Registering also gives you access to exclusive Apple content such as development videos, guidelines, tutorials, Q&As, and sample code. You will also have access to Apple's developer forums should you run into any questions that can be answered by the developer community. You can register at https://developer.apple.com/register/.
The free tier of Apple registration gives you access to the basic levels of development for Apple products. This limited access allows you to test your game on your computer (simulator) to make your game work, but without the ability to sell your game at the Apple Store.
The following are the steps available for you depending on whether you are registered as an Apple developer:
Sign in or create an Apple ID: Select whether you will need an existing Apple ID or create a new Apple ID. If you don't have an Apple ID, you will need to create one by clicking on the Create Apple ID button. If you have one already, click on the Sign In button and move ahead to step 4.
You will need to verify your Apple ID by responding to their e-mail. You will also need to repeat this process with the rescue e-mail address you provided. Then, click on Return to Apple Developer and you will be redirected to the iOS Dev Center (http://developer.apple.com/) to log in to your account. This will take you back to step 1, but this time you will sign in using your new Apple ID.
Read through the Apple Developer Agreement. Check the box once you are ready to continue and click on the Agree button.
Going a step further and becoming a certified iOS developer is a requirement to release your app or game for iOS devices. In other words, to perform testing on iPhones and iPads, gain access to beta software, or to release products in the Macintosh Apple Store or the iOS Apple Store, you will need to join one of the paid developer programs. You can join either the iOS Developer Program or the Macintosh Developer Program depending on which store you prefer to release from, or join both. It costs 99 USD per year per program, and it offers several resources that are helpful for programming and releasing your apps to the public. It is recommended to sign up for the iOS Developer Program as it will make testing much more realistic, especially when testing anything that has to do with touch.
Once you are at the website, select the Enroll Now button. The next screen describes everything you need to develop and distribute apps for iOS and OS X. Review the steps and click on the Continue button.
You will need to log in with your newly created Apple ID and hit the Continue button.
You will be redirected to the Sign in or create an Apple ID page. You should already be logged in with your Apple ID, so you can just hit the Continue button.
Choose whether you are registering as a company or as an individual. If you register as a company, you will be able to add additional team members who can access the program's resources and a company name will appear in the seller information in the App Store. If you register as an individual, your name will appear as the seller in the App Store and you will be the sole developer in your team.
On the Enter your billing information for identity verification page, you will need to enter your credit card information and then hit Continue.
On the Review your enrollment information and submit page, take a look through all of the information you have provided and make changes where necessary or click on the Place Order Now button to go to the next screen.
In the Program License Agreement page, read through the license agreements and click on the I Agree button.
Add the developer program to your cart. Click on Continue once you have entered all of the necessary information to pay for your account.
You will receive an e-mail from Apple with a verification code. Enter the code into the field provided in the dialog box. If you did not receive an e-mail, select the verification email button in the bottom-right corner of the dialog box, wait for the e-mail, and then enter it into the field. Click on the Continue button. Bask in the glory; you are now an official iOS developer.
Click on the Continue button when you are ready.
And that's all there is to it; you are now an official iOS developer. You can download the beta software, test on the actual hardware, and distribute your apps to your heart's content.
You can download and install Xcode from the Macintosh App Store at http://itunes.apple.com/us/app/xcode/id497799835?ls=1&mt=12.
Select the Free or Install button on the App Store page. Once it has completed the install process, just launch Xcode from your
You can find additional development tools from the Apple developer website at https://developer.apple.com/.
For Xcode 4.3 and later versions, if you need to remove Xcode, just drop it in the trash like most Mac applications. If you run into issues installing a new version of Xcode or just want to remove an older version and you need to completely remove Xcode from your system, you will need to run a special command-line instruction:
sudo <Xcode>/Library/uninstall-devtools --mode=all
This will ensure all of the associated files are removed from your library directory.
<Xcode>is the directory where tools are installed. For typical installations, the full path is
Before doing this, it is best to make sure this is really what you want to do, because once it is done, it is removed completely and thoroughly. You will always have the option of reinstalling Xcode, but you will need to go through the entire install process from the beginning and any additional resources you installed will also need to be reinstalled.
Xcode is Apple's Integrated Development Environment (IDE) for developing for both iOS and Mac OS X. In other words, most of what you will need in order to develop software for the Mac or iOS devices is integrated into one nice, clean application. When you install Xcode on your Mac, you get everything needed to develop for both the Mac and iOS devices. The IDE takes everything from your program and puts it all together into a single executable application; this is referred to as compiling. If you are compiling on your Mac or the iOS simulator, you can run your application once everything is compiled. However, it gets a bit more complicated when compiling for iOS devices, but we will run through that later.
Xcode.appeither through your finder in the applications directory or through Apple's Launchpad. If you have never created or opened an Xcode project before, you should be presented with a screen that looks similar to the following:
In the Welcome to Xcode dialog, select the Create a new Xcode project button. If you have created a project with Xcode previously, this dialog panel may not show up. If this is the case, you can navigate to File | New | Project.... This will open a new project window with the Choose a template for your new project dialog, as shown in the following screenshot:
In the left-hand side column, you will see a choice of operating systems and a list of types of templates. Apple provides several precreated templates for both OS X and iOS apps. We will discuss some of the different template types later in the book. For now, select Application under the iOS operating system. Select Single View Application from the precreated templates area and then click on the Next button.
The next dialog is your project options panel. This is where you will give your project a name and set some additional options. For our first project, we will set Product Name to
HelloWorldin accordance with standards set aside for all first projects in all programming languages. The organization name can be set to anything but is usually set to the name of your company or organization; for now, we will just use
The company identifier is a unique name that is used with the product name to create the bundle identifier for the product in order to distinguish your app from other apps. Apple recommends using a reverse domain name convention for your company identifier. This is like reversing the domain name or URL for your company's website; for example, if you were an educational company named Teaching Games, your website would be
teachinggames.eduand the reverse domain would be
edu.teachinggames. This would make your bundle identifier show up as
edu.teachinggames.helloworldin the next line. You do not need to set this right now if you are just building and running your app locally. As it is used to create your app's bundle identifier, it would be best to assign it before you start testing your app externally or submit it to the Apple Store.
The class prefix is a string of letters that will show up in front of the names of any custom classes you create for your project. This should be a short prefix. Some people will use their company's name, an acronym for their project, or their initials. Although this is not necessary, it does prevent collisions with other classes that may end up having the same names.
Once you have all of your information entered, click on the Next button.
You have now created your first iOS application. Once it is created, you are brought to the workspace window of Xcode. If you click on the Run button in the upper-left corner of the window, it will open the iOS simulator and run your app. As we have not added any code to tell the app what to do, it will only bring up a blank white screen.
You may have noticed the Create local git repository for this project checkbox below the file list. We will not be covering Git or any version control system in this book, but if you know what Git is and you are comfortable creating a repository, feel free to check this box. Otherwise, just leave it unchecked since it creates a lot of hidden files on your hard drive. If you are interested in learning about Git, feel free to check out their site: http://git-scm.com.
Once you have created your project, you are presented with the Xcode workspace. Most of what you will need to program for the iOS environment is contained within a single development environment: the workspace. The workspace is broken up into several sections, as shown in the following screenshot:
The toolbar rests at the top of your workspace area and stores your frequently used workspace management tools for quick access and reference. Not to state the obvious, but the toolbar is a bar where all of your tools like to live. The following screenshot portrays the toolbar:
Going from left to right, the toolbar contains the following tools.
The Run button can actually change based on the task you are running, but the primary function is to build and run your code. If your code builds correctly, it will run your app and start a debug session.
The Activity viewer gives you information on everything going on in your app. If something is wrong with your code, this will be the first place you see a notification. If you do get a warning or alert, you can get detailed information from the issues navigator (see the Navigation area in the screenshot of the workspace).
The Editor buttons allow you to choose from three different types of editors. The first button is the standard editor, which is what will be used in most cases and changes based on what you are editing. The second button is the assistant editor, which brings up an additional text editor window. The third button is the version editor, which is used when your app is tied to a source control system.
The Navigation area is broken up into three sections (from top to bottom): the Navigation selector, Content window, and Filter bar. The entire navigation area can be turned on/off using the leftmost View button on the toolbar. The Navigation area can be seen in the following screenshot:
- The project navigator: This is used for navigating, managing, and organizing your project files. By selecting your file from the Content window, you will be shown the selected file in the Editor area where the file can be modified. The filter bar changes to let you add and import files, show recent files, show source-controlled files, show unsaved files, or only show files with a specific name.
- The symbol navigator: This is used for viewing a list of all of the symbols in your project. By selecting an item from the content list, you will be taken to the file and position of the symbol's location. The Filter bar lets you show only class symbols and project-defined symbols, hide members, and filter by a specific name.
- The search navigator: This is used for searching and optionally replacing the content of your data, returning any matches to the Content window. You can search your project by typing what you would like to find in the search field at the top of the content area. If you select anything in the Content window, the Editor area will take you to the line of content matching your search. The filter bar changes so you can filter your results to show only specific filenames.
- The issue navigator: This shows a list of active errors and warnings in the Content window. If you select an item from the list of errors, the editor will identify the item with the issue and if appropriate will take you to the line of code with the problem. Your Filter bar changes to show only items from the current build, to show only errors, or to display specific content.
- The debug navigator: When in debug mode, this will show a list of the running threads and the related stack information. When an item is selected in the Content window, information about the item is displayed in the Editor and Debugger areas. The Filter bar changes to show a Thread Filter button, which only shows relevant threads and a Call Stack Slider, which shows a list of stack frames. You can adjust the slider to show the most relevant to all of the stacks.
- The breakpoint navigator: This displays a list of active breakpoints in the Content window. The Filter bar lets you add or delete specific breakpoints, show only active breakpoints, or filter by specific matching content.
- The log navigator: This shows an active history of your tasks and session events that have happened during your development process. When an item is selected in the Content window, the matching log displays in the Editor area. You can filter content by most recent or by specific names using the Filter bar.
The Content window is the area where your data is displayed based on which navigation button you have selected. Typically, if you select an item in this area, the file's data will be displayed for modification in the Editor area of the workspace window. For specifics on what is displayed in the Content window, see the corresponding navigation button listed previously.
The Filter bar reduces the amount of information returned to the Content window. The options available to the Filter bar change based on the navigation button that is selected. For details on which options become available, see the corresponding navigation button information listed previously.
The Editor area is where most of your development will take place. The type of editor window can be changed in the toolbar using the Editor buttons (see the screenshot of the toolbar). For now, we are going to go through the standard editor window:
- The Related items button lists additional selections relevant to your currently opened file.
- The Next and Previous history buttons are used to jump back and forth through the files you have opened. If you press and hold either of the history buttons, a drop-down list will appear with a list of your entire history.
The hierarchy list is used to navigate to the currently opened file:
The type of editor that will be displayed will depend on what you have selected in the Content window:
The Debugger area of the workspace window is turned off by default, but it can be turned on or off using the middle View button on the toolbar. The Debugger area is used for examining detailed information about your application while it is running. The buttons at the top-left corner of this area are for stepping line-by-line through your code and for viewing what is happening in your code as it runs. The three buttons on the right-hand side of the top bar control what is displayed in the Content window of the Debugger area. The left button is to show your variables, the right is for the console only, and the middle button shows both. We will discuss how this works in greater detail in the debugging section of the book.
The Debugger area can be seen in the following screenshot:
The Utility area of the workspace window, sometimes referred to as the Inspector area, can be turned on or off using the rightmost View button on the toolbar. The Utility area displays specific details for what is shown in the Editor area. Depending on what is in the Editor area, the Utility area could be limited to information about the file itself, such as size and date created, or it could end up offering multiple types of utilities for the data. The Utility area can be seen in the following screenshot:
The Inspector selector bar lets you change the content in the Inspector pane. There are several options that will appear in the bar depending on what kind of content is in the Editor area. The file inspector and quick help will always be available, but the rest will appear or hide depending on what is needed.
The following are items you will find on the Inspector selector bar:
- The file inspector: This shows all of the metadata that is available for the selected file. This may be the name and file information or it could include subcategorized information associated with the file. We will describe these items as necessary throughout the book, but for now, just know that the information can change.
- Quick help: This will display the declaration, description, platform, and operating system (OS) availability, as well as where it is declared, reference information, guides, or sample locations.
The following is a list of inspectors that may be available in some editors:
- The identity inspector: This enables the user to view and manage metadata for an object, such as its class name.
- The attributes inspector: This enables the user to configure attributes of the selected object. The attributes available are directly related to the selected object.
- The size inspector: This enables the user to assign characteristics, such as autosizing, for an object.
- The connections inspector: This enables the user to view the outlets and actions for an object, make new connections, and sever existing connections.
- The bindings inspector: This enables the user to generate, view, and/or configure bindings for view objects.
- The effects inspector: This enables the user to identify settings for animation and other visual characteristics of a chosen object.
Use the library pane to access libraries of resources that are ready to use in your project:
- File templates: These are templates for general types of files and code constructs. To use a template, drag it from the library to the project navigator.
- Code snippets: These are frequently used, short pieces of source code for use in your software. To use one, drag the snippet into your source file.
- Objects: These are interface objects. To use them, drag them directly into your nib file in the interface builder editor window.
- Media files: These comprise of graphics, icons, and sound files. To use them, drag them directly to your nib file in the Interface Builder editor window.
The iOS Simulator is a standalone app that imitates everything about iOS devices. It saves you a tremendous amount of time by allowing you to run and test your code in a software-based environment before releasing it on the hardware. The iOS Simulator can simulate iPhone and iPad using different versions of the operating system.
You can access the iOS Simulator by going to Xcode | Open Developer Tool | iOS Simulator. A second way to access the simulator is by running an iOS product and selecting one of the simulator schemes; in that way, the iOS Simulator will automatically launch.
Rotate left / Rotate right: These rotate the simulator window to the left or right.
Shake Gesture: This simulates a shake on your device.
Home: This simulates the Home button on your iOS device.
Lock: This will lock the simulator and take you to the slide to unlock the screen that you would normally see on your iOS device.
Simulate Memory Warning: This will send the active app a low memory warning.
Toggle In-Call Status Bar: This brings up the flashing green Active Call bar and replaces the standard status bar. This is very useful to see how your app's user interface will react while a phone call is running.
Simulate Hardware Keyboard: This turns on/off the iOS keyboard.
Tap: This is achieved by a mouse click
Touch and hold: Hold the mouse button
Double tap: This is acheived by double-clicking a mouse button
Swipe: Click, drag, and release your mouse
Flick: Click, drag, and release your mouse
Drag: Click, hold your mouse button down, and release at your final position
Pinch: Continuously hold the option key down on your keyboard, move the finger position in circles by moving your mouse, hold the shift key on your keyboard to move the center point of the pinch, and click-and-drag to simulate the pinch
In this chapter, we covered how to navigate Apple's website to become an Apple developer, download and install Xcode, and the basics of working your way around the Xcode IDE. Everything you learned in this chapter will be referenced throughout the book and you will most likely find yourself back here trying to find out where something in Xcode is located.
In our next chapter, we will introduce you to programming in Xcode and learning the Objective-C language. We will be covering the basics on how to program as well as details on object-oriented programming.