Developing your first iOS Application

Developing your first iOS Application

Submitted by Christian Crawford on Mon, 07/28/2014 - 16:04
xcode logo

Developing an iOS application may seem like a daunting task for one to complete, especially if you are not familiar with the Objective-C language and its syntax. However it’s actually not all that difficult to create a basic hello world like application with very little knowledge of the language. If you are familiar with the C programming language the code should look somewhat familiar. If you are at all familiar with programming and would like a crash course in the Objective-C language I have found a good one here. Since the IDE used to write the application only works on Macs you need to have one yourself or know someone who will lend you their computer to write the program. 

The first step in creating the application is to launch Xcode. Once you have made it to the first screen you should click on create new Xcode project and then choose the “Empty Application” option and hit next. You can then fill in the various fields with information as you choose and once complete click next and tell Xcode where to store your project. After the program has loaded up your new application template you can try it out by clicking on the play button in the top left corner (or command + r).

The application will show up as a simple white screen since you have not written any code. Now that you have seen your application in action you will next create a new class file (command + n) and chose the Objective-C class. This file will be the view controller and this should be named like (Projecetname)ViewController and the UIViewController should be chosen from the subclass drop down menu. Before you hit next make sure the “With XIB for user interface” is checked. Xcode will now take you to the interface building tool.

In the bottom right corner you should see a list of available UI elements that can be added. Look for the button element and then click and drag the object onto the canvas where you’d like to place it. Once you have the button where you’d like it double-click on the button and change the label to something like “tap this”. Before the button can be displayed in the application a few lines a code must be written to link the new files you just made to the existing interface. The first line of code should be written after the other import statement in the AppDelegate.m file

    #import "HelloWorldViewController.h"

Next add the following lines to the first method in the file after the “self.window.backgroundColor…” line:

    HelloWorldViewController *viewController = [[HelloWorldViewControlleralloc] initWithNibName:@"HelloWorldViewController"
    bundle:nil]; self.window.rootViewController = viewController;

These lines of code have loaded the xib file and set it as the root view controller. If you try running your application now you should see the button on the screen, however we have not programmed any logic therefore nothing will happen if you tap on it.

Now to it’s time to make the button preform an action when pressed. You will begin by adding the following line to the ViewController.h file just before the @end line:


Next you will add the following lines to the ViewController.m file just before the @end:

       UIAlertView *helloWorldAlert = [[UIAlert alloc] initWithTitle:@”My first App”
       message:@”Hello, World!” delegate:nil cancelButtonTitle:@”OK” other
       [helloWorldAlert show];

The line of code in the header file is the method call. The IBAction is a property that marks a method as something that can have an action connected to it in the UI. In the second block of code a UIAlertView object is created and the fields are filled with appropriate strings ("initWithTitle" is the title of the alert, "message" is the message that will be displayed, etc.) The final line calls the show method so iOS displays the pop-up message.

0 0 1 640 3653 Tcraw Inc 30 8 4285 14.0 Normal 0 false false false EN-US JA X-NONE /* Style Definitions */ table.MsoNormalTable {mso-style-name:"Table Normal"; mso-tstyle-rowband-size:0; mso-tstyle-colband-size:0; mso-style-noshow:yes; mso-style-priority:99; mso-style-parent:""; mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-para-margin:0in; mso-para-margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:12.0pt; font-family:Cambria; mso-ascii-font-family:Cambria; mso-ascii-theme-font:minor-latin; mso-hansi-font-family:Cambria; mso-hansi-theme-font:minor-latin;}

The only thing left to do is establish a connection between the button you made earlier and the show message method. Open the ViewController.xib file and press and hold the command key. Next click on the button and drag your cursor to the File’s Owner item in the left-side panel. Once you let go click on the showMessage option. Now you can compile and run (command + r) the application one more time and this time the application should be fully functioning.

Hello World

Christian Crawford

Profile picture for user Christian Crawford
Lead Software Developer
  • Drupal 7, 8, & 9 site building, module development, theming
  • Java and C
  • SQL (MySQL and Oracle), NoSQL (MongoDB)
  • ReactJS, AngularJS, Svelte, jQuery, NodeJS, ES6
  • Nginx and Apache Stacks