Results 1 to 1 of 1
03-10-2012, 06:12 AM #1
Xcode 4: Beginner Vocabulary Tutorial.
You need a Mac to use Xcode.
I've decided to make a tutorial showing the basics of Xcode, and how to use them. This tutorial will be centered around a basic HelloWorld iPhone app, that anyone with five minutes of time can create, but i will not be walking you through making it. I'm just using it as an example, for some simple code. If you do want to make one, you can check the Apple dev. area, or anywhere on YouTube.
You can pick up a copy of Xcode 4 for free from the Mac app store. You just need a Mac running OS X Lion.
This is a lesson, not just a tutorial. This is not going to be a "here's some code, paste it in," kind of thing.
Let's start with some simple vocabulary.
is your Project Navigator. With this, you can access the various files of your application. There are three main files you'll be focusing on in this: the ViewController.h, the ViewController.m, and the MainStoryBoard.storyboard. There will also be a second storyboard file if you plan on making your app for running on an iPad as well. We'll come back to the various files later.
Let's take a look at the top bar.
The first button you'll see is a Play button that says 'Run' and beside that a 'Stop' button. These allow you to start the iOS simulator that lets you run your app without having to put it onto a physical iDevice.
Next you'll see a bar that says the name of your app, in this case HelloWorld, and beside that a bar that says iOS Device. With this, you can choose from three different devices to run your device, as shown below.
If you have more iOS SDK's downloaded, you can test your app on different firmwares, but we'll just stick with iOS 5 device for now.
Next you have a box with a triangle-like symbol inside, and below that 'Breakpoints.' Breakpoints are simply for providing breaks between lines of code.
Next you have this box:
Which shows whether there were any errors compiling your code, the last successful build of your device, and when it was last saved.
Next, at the far right, you have the Editor.
The Editor provides different views of your code/storyboard, as shown below. There are three views in the Editor: the first one provides a clean single view of whatever file you're looking at. The second ones provides a view of the last two files you clicked, with a clean horizontal break. The third view is a lot like the second, except it shows blue and orange areas wherever script in different files link to one another. It is most useful when viewing the ViewControllers.
The three views are all useful for different times.
The next thing we have is the View buttons. They slide specific portions off screen, allowing you to see your code or storyboard better.
Remember those ViewControllers and storyboard files we talked about? Let's move on to them next. The .h and .m ViewControllers are a lot more simple than they first appear. It's actually really simple once you know what you're looking at.
The .h ViewController is where you place your references and variables. It defines variables, and it defines IBActions. IBAction's do a lot of different things, like making a button for it, making it start on launch, simple things like that. In the .h, asterisks * define variables. In the .h, you'll be defining the things you need to code in your .m, like buttons.
The .m ViewController relates directly to the .h, as you can see by what the third tab in the Editor shows. The .m is where you place all of your actual code. You can see some of the code in both the .h and .m up, in the Editor views. The .m is where you'll be doing the majority of your time, not counting the storyboards. If you want to learn what all seemingly meaningless stuff i have in my .m is, check out my tutorial on Objective C.
Next we have the storyboard files. The .storyboards are where you will be creating labels, buttons, and views for your application.
This is what the storyboard for my HelloWorld app looks like it. The most important part of your storyboard is the column of stuff at the left.
This column contains numerous things to help you create your iPhone app, and choose exactly how it will look. At the bottom, you'll see a box with various items in it. Within this box, when the tab is set to Objects like mine currently is, you can drag buttons, labels, text boxes, and different views to your iPhone screen. This is very important; you want your app to look good if people are going to download it. WIthin the storyboard files, you'll craft what your app looks like. In the .h and .m, you'll input the necessary code for how the different things react.
That's all for this tutorial, for now. If you have any questions, feel free to ask. And now here's a video of my HelloWorld app running in the iPhone simulator.
I am aware that the quality is shitty, i used the Quicktime screen recorder included with my computer.
Last edited by ToxicJew.; 03-12-2012 at 01:14 PM.
Tags for this Thread