From this point onward, I will be working under the assumption that the audience of the tutorial possesses a basic understanding of C Programming. If you are not familiar and comfortable with the following items, head back to the last post and brush up on your C:
- Data Types (int, float, double, char, string, etc.)
- Functions (Methods)
- IDEs / compilers
- Compiler Errors / Runtime Errors (and the difference between)
- Pointers / References / Memory
I will explain all concepts that are specific to Objective-C (and in certain cases, object-oriented programming), but will not go over the basics mentioned above.
In this tutorial, we’ll go over two programs: the Hello World of Objective-C, and the Hello World of iOS Applications. (For those who haven’t caught on, Objective-C is the name of the programming language one uses to write iOS apps or Mac applications.)
I will explain very little code in these two exercises. The point of going through these is to familiarize you with Xcode, and the process of creating your first app. Once you’ve successfully created and ran both Hello World programs, you’ll be ready to move on.
This one is simple. Fire up Xcode, and select New Project. Choose Command Line Tool from the Mac Applications Menu, give your project a name, and save it to a sensible location. Once you have your new project open, click main.m over on the left of your screen. (Find these steps in the previous lesson, if you are lost.) You are now looking at the code for Hello World in Objective-C.
Notice the line:
NSLog functions very similarly to C’s printf. The main noticeable difference is that NSLog automatically creates a newline after a string. For our needs,
are virtually identical.
Go ahead and click Run in the upper left corner of Xcode. Do you see Hello, World! in your output console at the bottom of your screen? (Did you remember to click the View Debug Console button at the upper right corner of your screen?) If so, that’s it! You’re done. Xcode makes generating a Hello World program in Objective-C as easy as possible.
HelloWorld: iOS App
This Hello World program will be slightly more complex. I’m going to walk you through how to set up your interface and implementation, and how to connect these to your application’s user interface.
Before we begin, a bit on Storyboarding. Storyboarding is a new feature in Xcode that makes app design even simpler. For much of the tutorial, we will be ignoring Storyboards, and building our app with nibs. Jumping straight into storyboards, while easy, would prohibit you from learning many important underlying details.
To start your Hello World program, make a new project in Xcode. For this project, choose iOS -> Application -> Single View Application.
Name your program HelloWorld_iOS, give yourself a company name, and set Device Family: iPhone. Uncheck Use Storyboard, Check Use Automatic Reference Counting, and Check Include Unit Tests.
Go ahead and click Next, save your file, and click Create. Looks familiar, right? Look at your Project Manager (the list of files on the left, where main.m used to be.) Notice that you now have a series of new files:
as well as a few other folders. These are all the basic files you need to make a simple single-view application.
We’re going to begin by setting up our interface in ViewController.h. Go ahead and add the code shown below to your ViewController.h file.
Line 12 defines a label object for our user interface. helloLabel is an arbitrary name I chose.
Line 15 is a method declaration, and describes the method which I named showHello. This alerts our compiler that our object can be sent a message, called showHello. (Note: In Objective-C, we no longer call functions. We send messages to objects.)
Next, we’re going to work on our implementation, ViewController.m. Notice how many vital functions are created for you by Xcode. Because of this, we only need to add the implementation for our one new method: showHello. Beneath the didReceiveMemoryWarning method, add in the code to implement showHello.
Check out that syntax.
[helloLabel setText:@"Hello, World!"]; This is how you send a message to an object.
Here, helloLabel is our object, and “Hello, World!” is the message we’re sending it.
Now, we’ll move on to our user interface. We need to give our users a way to interact with all of the awesome code we just wrote. You’ll find this in your nib, ViewController.xib. (“Nib” is an outdated name for .xib files that just won’t die.) Go ahead and click on ViewController.xib.
If you don’t have your two sidebars open like I do in the screencap, click the three View buttons in the upper right-hand corner of your screen. You’ll need your right-hand sidebar in particular, as it has our Utilities Window in it. (The Utilities Window is the list of items at the bottom right of your screen. See listed: Label, Round Rect Button, etc.)
Start building your user interface by clicking on a Round Rect Button, and dragging it onto your view.
Double-click on your button, and give it a name. This text will be visible to your user.
Next, click on a Label, and drag it over to your view.
You can click on the edges of your Label or Button, and resize them. Notice that Xcode will provide you with a few basic guidelines, to help you with placement.
Now, click on the label and delete the default “Label” text. This will make the label difficult to locate in the future, but looks much nicer. (Otherwise, the word “Label” would be visible to our user!) Since we only have one label, I trust we can remember where it is.
Right-click (or ctrl+click on a Mac with right-clicking disabled) on your button. This will bring up a list of options. Send Events are important to us right now. These are types of interactions the user can have with our button. We’ll choose Touch Up Inside, which means “Consider this button activated when someone taps inside of this button, and lets go.” Touch Down Outside, by contrast, would mean “Consider this button activated the INSTANCE someone taps the very edge of the button. Don’t wait for them to lift their finger back up.” Personally, I find Touch Down annoying. Select this option by clicking the circle next to the text Touch Up Inside, and dragging it over to the File’s Owner. The File’s Owner is the outline of a cube, on the left of your screen.
Notice that it gives us the option showHello, our method! Click showHello. You just informed Xcode that you want the method showHello to be called when a user taps that button.
If you did this correctly, your menu will now look as so:
Next, right-click on the label we made earlier, and select the circle next to New Referencing Outlet. Drag it over to File’s Owner as well.
Choose our label, helloLabel. Now our helloLabel object in our code is associated with this label on our user interface.
And again, make sure your menu looks like mine:
Let’s think about what we’ve done so far.
- We have a button on our user interface, associated with our showHello method.
- In ViewController.m, our implementation, we have a method called showHello, which sends a message to helloLabel:
[helloLabel setText:@"Hello, World!"];
- We have a label object, helloLabel, which received the message (“Hello, World!”) from showHello.
- And we have a label on our user interface, which is now associated with the content of helloLabel.
Now, it’s time to test! Go ahead and click Run. Because we chose Single View iOS Application when we made our new project, clicking Run will start up the iOS Simulator.
In the iOS Simulator, click your button, and see if it works! If Hello, World! shows up where your label is, you did it! You made your first iOS app!
If you weren’t so successful, it’s time to go back through the tutorial and troubleshoot. Do you have typos in your program? Did you forget to hook your button and your label to File’s Owner? If you can’t figure it out, leave a comment on this post for help.
Intro to Objective-C Tutorial by Michelle Leonhart is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.
Based on a work at www.tinwhiskers.net.