iPhone Programing (Hello World)
Hey guys, this is Matt. Kids, I don't want this. This is going to be a video on developing for the iPhone. That's right, developing for the iPhone! Some of you already have Xcode and have downloaded the iPhone SDK to program your own app for the iPhone, and some of you still need to download the iPhone SDK.
To download the iPhone SDK, you need to go to Safari. Go to developer.apple.com. Okay, pretty simple. Just go to under iPhone Dev Center, click "Visit iPhone Dev Center." Then click "Login." I will have a link to that iPhone Dev Center. Then you want to type your Apple ID, which is on if you have iTunes. If you use iTunes, it's your iTunes email address that you use for iTunes, and your password. If you don't, you can easily make an Apple ID.
So, I'm just going to type my password and click "Login" or hit enter. Okay, so now we’re logged in. Okay, and however you want to do it, you can just download the iPhone SDK right there. Once it's downloaded, you'll be able to do whatever you want. You'll be able to install it with the package. Once it's installed, you can just open up Xcode, which will be one of the things that's installed.
In the Xcode thing, you can go to File, New Project. Under iPhone OS, under Application, select Window Based Application. Then, click "Choose" and take your name. We're going to make a Hello World application, so we're going to call it "Hello World." I actually spelled "Hello World" wrong. I spelled "Hello" with a W at the end. End of the name, just ignore that.
Okay, so this window will come up. Sometimes this won't be there, but if it is, that's okay. It doesn't matter. So, groups and files will have all these files. Under "Ages," want to select the main thing, Hello World. Under that, there will be these things on, in Main Menu.xib or Main Window.xib. That will be among them. Just double-click that, and that will open another thing that's installed with the iPhone SDK called Interface Builder.
With Interface Builder, we can build our interface for our application. Normally, the library window will be on the left, and in this other window, the Attributes Inspector will be on the right. If they're not, you can go up to Tools, Library on the Tools menu, and of course, Tools, Inspector to bring up the Attributes Inspector.
Okay, so now we can just, under Object, under Libraries, you select Objects and select Library. Now we want to go to—these are the main controls we're going to be using as Label, Round Direct Button, and Text Field.
So, first of all, we want to drag two Labels onto our palette, onto our window. The first label will be right next to the sector; we'll make the say "Hello." The second one will say "World." The reason we have to is that we're going to change the text of the second one to be whatever you want it to be.
Okay, so next, you want to drag in a Text Field. On the left, just click it, drag it in right there. Okay, now you want to drag in a Round Rect Button. So we also—I'll just drag on another label and put it right here and also say "Name." Also, change this to say "Okay," and I'll change it to say "World."
Okay, so now we have our interface in place. Maybe if you want, you can just drag something else on for fun. I don't want to, but you can if you really want to. So now we go to File, go up to Save, and that saves everything in Interface Builder.
So right now, we built the interface to our application. Now you can just quit Interface Builder. You can also go up to the Interface and click "Fit." Now, back in Xcode, you want to go up to Action, "Add New File." Then under iPhone OS, select "Cocoa-Touch Classes," and then in here, select "NSObject Subclass." Then click "Next."
Right here, under the file name, I’m changing "Untitled" and naming it "Code." Class name is going to be our class name, so just remember "Code." Then we click "Finish." Now, wherever "Code.h" and "Code.m" are—mine happen to be under Resources—you want to select those two and drag them over to Classes.
Okay, now if we select Classes, you can see "Code.h" and "Code.m" are among these. So first, I'll click "Code.h," and so this is our code that .h file. By default, right here's what it looks like. So right here, between this @interface and this @end, right here, there’s a line we want to type the following line of code:
@interface Code : NSObject
Click "enter." Now, I’ll write @IBOutlet
and I will have—you will be able to download all this code in the description of this video. There will be a link.
So, @IBOutlet
space UILabel
space *nameLabel;
semicolon. Okay, now hit enter. Now, @IBOutlet
space UITextField
space *nameTextField;
semicolon. Right here is our label and our text field right here is the code. Remember, you will be able to download this.
Now, outside of the closed bracket, in the inside of the @end, right here, there's a line we want to type the following line of code:
-(IBAction)click:(id)sender;
That's all we need right here, and we can just copy this whole line except for the semicolon. So now we've copied this; there's a semicolon there. Just like this.
So we’ve copied the thing: -(IBAction)click:(id)sender;
. Okay, so now we want to just save "Code.h." Go up to File, Save.
Now, we’ll select "Code.m." Now, in here, in between the @implementation and the @end, we'll paste that in. If you did accidentally copy the semicolon at the end of that line, delete it.
So, what we should have is:
-(IBAction)click:(id)sender
and this is case sensitive, by the way, which is why you should just download the source code and look at it.
Okay, so we've typed this space open curly brace. That is Shift + open bracket. If you don’t already know what curly braces are, watch the keys on your keyboard for more information.
So we’ve done open curly brace, then you hit enter, and then we'll type close curly brace. Now create a line between this line and this line. So in between the open curly brace line and the close curly brace line, and within there, we're going to type the following, and this is important:
[nameLabel setText:[nameTextField text]];
Another close bracket, semicolon. So this is our code; this is all we've typed in "Code.h." So now I'll save this up to File, Save.
Okay, now under "Hello World," right here, we can just once again double-click on "MainMenu.xib." I will just double-click on that. And by the way, to edit these pieces of code under Classes, we just have to double-click. That's just important.
So now back in Interface Builder, we have our interface again. We also have this window move with all the files in it. If you haven't quit Xcode, then you should look for it because it's important.
So right here on the library objects, you need to find the object called "Object." Looks like this—this arm orange Q. You just want to drag it into this list of files. Okay, so now in the Attributes Inspector, you want to select the object, go into the Attributes, which you can get to right-clicking Tools, Inspector. You just select it, and on the Attributes, there's going to be something that says "Class." I click that; it's an eye icon.
Under that, it will be something that says "NSObject." Change that to say "Code" because that's what we called our class. That's the class name, "Code."
Now to incorporate the code with the interface: First, we click on "Code," hold Ctrl, and drag it over to the Text Field. That will mate, say, "World," and we say "nameTextField." Now we also have this label that says "World," so we want to click on "Code," hold Ctrl, and drag it over to that label. That says "World," almost like a "nameLabel."
Okay, now on the "OK" button, we select the "OK" button first. Hold Ctrl and drag it over to "Code." Then we select "click"; that's what we called the event. So now we can just go up to File, Save in Interface Builder and I'll go back to Xcode, just to demonstrate this to you.
Okay, so now that I'm back in Xcode, you just want to click "Build" and "Go." This will run our project.
So right here is our project running in the iPhone simulator. And here it is. So it says "Hello World." If we change this thing that says "Name" to say "Dave," then we click "OK," it'll say "Hello Dave."
So these are the basics of programming. Stop back next time for an Xcode lesson 2 for the iPhone and learn more. Good!