Build a Simple App

To build a simple app in Xcode you will want to have a Mac computer that has the latest version of Xcode from Apple installed on it. Let’s go ahead and create an app with a button that shows “Hello World” when the button is clicked.

Begin by opening the Xcode editor and choose Create a new Xcode project, then under iOS application click Single View Application. The product name will be the name of the app or Hello_World in this case. The organization name is the name of your company or organization. Then select Objective C as the language and iPhone as the device. Be sure to leave Use Core Data unchecked, since this is a simple app. Click next to continue and leave Create Git Repository unclicked. Then click create and pick a folder to save your project in.

On the left pane is the project navigator, the middle is the editor area and on the right is the utility area. In the project navigator on the left, select the
Main.storyboard file. You will see the visual editor for Storyboards known as the Interface Builder. This is a visual way developers can create apps. To keep it simple, disable size classes. In the file inspector in the utility area on the right, uncheck Use Size Classes and choose keep class data for iPhone.

To Add the Button

To add the “Hello World” button to the view go to the bottom part of the utility area and find the Object Library. If you don’t see it, click on the Show Object Library button. Drag the button to the view. You will see horizontal and vertical lines which will enable you center it. To edit the name on the button, double-click on it and name it “Hello World”. If you hit the run button, you will see a “Hello World” button. But to have it work when you press on it you will need to add a few lines of code.

In the project navigator, select the viewController.h file. You should see the source code in the editor area. Add the following line of code before the
@end” line:

-(IBAction)showMessage;

Now, choose the ViewController.m file and add the following code before the “@end” line:

-(IBAction)showMessage

{
UIAlertController *helloWorldAlert = [UIAlertController alertControllerWithTitle:@“My First App” message:@“Hello World!” preferredStyle:UIAlertControllerStyleAlert];

UIAlertAction *okayAction = [UIAlertAction actionWithTitle:@“OK”
style:UIAlertActionStyleDefault handler:nil];

[helloWorldAlert addAction:okayAction];
// Display the Hello World Message
[self presentViewController:helloWorldAlert animated:YES completion:nil];
}

*Note: this code is from Learn iOS Programming from Scratch by Simon Ng. I highly recommend this book!

Finally, you need to connect the button with the action. Select the Main.storyboard. Press and hold the control key on the keyboard, click the “Hello World” button and drag it to the View Controller icon above it. Release both buttons and a pop-up will appear. Select the show message option. The app should now work. Test it by hitting the Run button. Congratulations on building an app!

More About IBOutlets and IBActions

A basic concept when creating an iOS app in Xcode is making connections. A connection lets one object know where another object is in memory. There are two kinds of connections that you can make in Interface Builder: outlets and actions. An outlet points to an object and an action is a method that gets triggered by a button or some other view that the user can interact with.

IBOutlet can be used in your code to indicate that the property can be accessed from an interface element like a button. This means that the property can be accessed by Interface Builder as an outlet in the interface.

IBAction is used by Interface Builder to help you build the interface. It signifies an action that can be connected to a control. The compiler defines IBAction as void, so when you compile it, it looks like a standard method.

Show your support

Clapping shows how much you appreciated patti’s story.