Developing an iOS application has become very simple, as we have numerous tools that make the whole process of development easier. I assure you that you will be thrilled to bits when you develop an iOS application and deploy it in the Appstore.
This tutorial will help you in developing an iOS application from scratch. It will also help in understanding the Xcode IDE and will cover some of the basic concepts in iOS programming.
How to set up the development environment
On your MacBook or iMac, install Xcode from the Appstore. This setup is enough to develop and run applications in the simulator. If you want to deploy the applications that you develop in the device or distribute your application in the Apple AppsStore, register yourself with the Apple Developer program.
Now, let’s learn the basics of Xcode and iOS programming by creating a simple iOS application.
Create an Xcode Project:
1. Open Xcode and select File -> New Project
2. Select Single view application from the Xcode templates and Click ‘Next’. There are various templates available in the Xcode. Try exploring all the templates. In this tutorial we will stick to the Single View Application Template.
3. The screen below allows you to configure some of your Project Settings.
- Product Name: the name of your application
- Organization Name: can be your name or the name of your organisation. This name will be added in the copyright notices to each and every source file.
- Company Identifier: a unique string that is used to create a bundle identifier. In order to make this unique, Apple recommends following reverse naming convention, e.g. com.companyname
- Bundle Identifier: the company identifier with the product name forms the Bundle Identifier.
- Class Prefix: the name given here will be prefixed with the name of the new classes that you create. This is done to avoid name collision between the existing classes and the custom classes created.
- Devices: specify whether you are targeting this application for iPhone, iPad or both. Let’s select iPad for this example.
- Use Storyboard: the conceptual representation of your application flow. Let’s not worry about this for our simple example application. Disable this option.
- Use Automatic Reference counting: select this option. Prior to iOS 5, developers should manage memory manually. By enabling this option, memory management will be taken care of automatically.
- Include Unit Tests: disable this option. Enabling this helps the developers in performing unit testing.
Once you have configured the above settings select ‘Next’.
4. Specify the path where you want to save your project. Enabling the option ‘ Create local git repository for this project’ will place your project under version control. In this tutorial we will disable the option. Enable this option when you are actually working on some App Store projects. Explore and try to gain expertise on version control.
5. Finally, click on the ‘Create’ button.
Understanding Xcode IDE
The Xcode window has the following components
1. Top Tool Bar. The run button in the toolbar enables you to run/stop the application. The editor and the view button on the right side of the toolbar change the look and feel of the Xcode user interface itself. Play around to find what each and every button does.
2. Navigator view on the left displays the source files of your project.
3. Main view at the center displays the contents of the file selected in the navigator. This is the editor view where you write the code and configure your build settings.
4. Inspector view on the right gives extra details and configuration settings on what is being selected or displayed in the main view.
Select the Project in the navigator. The project details will be displayed in the Main view.
The Main View contains two sections
- Project refers to the repository of source files, resources and data that are required to build a product
- Target refers to the actual build/product.
Selecting either the project or the target displays its settings on the right, which can be configured if required.
Run the Project
Click on the run button in the toolbar. The target/product displayed in the left side of the toolbar will be run on the simulator/device specified in the toolbar.
Since we did not modify the code, you should be able to see a blank screen in the simulator.
Understanding the files in the project
- Interface file: This is where the variables and methods of any class are declared.
- Implementation file: Actual implementation of the methods is done here. Ends with .m extension
- Interface builder file: As the name implies this file helps in building the application’s user interface. Ends with .xib extension.(Xcode’s Interface Builder)
- Precompiled header files: These files are compiled and stored in cache. It is automatically included with every source file during compilation. Ends with .pch extension. You can include import statements of common files in the .pch file.
- Frameworks: Libraries required for developing an application. By default, the following libraries are added. We can include other iOS frameworks if required. We can also create our own frameworks and include them in the project.
-
• UIKit framework is required for rendering the UI.
• Foundation framework handles low level data types manipulation.
• Coregraphics framework – Quartz 2D functionalities. - Plist: An information property list file contains configuration information for the executable.
- Infoplist.strings: Stores the values for a particular localization.
Ends with .h extension
What is the entry point for an application?
Any C program will start with a main function and Objective C is not an exception to it as it is the superset of C.
The main function is available in the main.m file.
#import <uikit /UIKit.h>
#import "TTTAppDelegate.h"
int main(int argc, char *argv[])
{
@autoreleasepool {
return UIApplicationMain(argc, argv, nil, NSStringFromClass([TTTAppDelegate class]));
}
}
autorelease pool
helps in automatic memory management of the objects created in an application.
UIApplicationmain
function accepts four arguments. The first two denote the number and variable list of command line arguments which can be ignored. The third argument specifies the application class for which an instance should be created. If this argument is nil, UIApplication
class is taken as the default value.
The fourth argument specifies what class the app delegate instance should be. UIApplicationMain
makes this instance as the delegate of the application instance (3rd argument). This means that this delegate object gets notified whenever the UIApplication
instance reaches certain states like application becomes active, application enters background state, etc.
Now the UIApplicationmain
will start calling some of the delegate methods. As soon as the application launches application:didFinishLaunchingWithOptions:
is called which is responsible for displaying the initial view to the user.
The app is now launched and UIApplicationmain
will still be running and maintaining the event loop, which will respond to the user actions as and when they occur.
AppDelegate Launch Method
As mentioned earlier, application:didFinishLaunchingWithOptions:
is the first method that is called after the application launches.
It creates a UIWindow object that manages the views that are displayed in the device screen. The UIWindow object sits at the top in the view hierarchy.
It also creates a view controller object and adds it as the rootviewcontroller of the window object. It displays the viewcontrollers’s view in the device screen.
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
// Override point for customization after application launch.
self.viewController = [[TTTViewController alloc] initWithNibName:@"TTTViewController" bundle:nil];
self.window.rootViewController = self.viewController;
[self.window makeKeyAndVisible];
return YES;
}
Interface Builder
Let’s play with the Interface builder.
Select the TTTViewController.xib file in the Navigator Panel.
Select the view object in the MainView. A view object will be displayed in the main view.
Click on the Attributes inspector at the top.
Check for Background color property and change it to your favourite color.
Select objects library at the bottom of the inspector panel.
Drag and drop a button object inside the view.
Add some text to it by clicking inside the button.
Run your application in the simulator.
Now it is your time to play around and familiarize yourself with the Interface Builder
Conclusion
By now you should be able to create a static user interface. Your iOS journey has begun, and it will continue.