RSS

Xcode for beginners 02 – Hello World

16 Jan

As is traditional in programming courses, your first app will be a Hello World example. Specifically, the words “Hello World” will appear at the touch of a button on screen.

The screencast below walks you through what you need to do in Xcode, from creating a new project to running your app in the iOS simulator. The code itself is explained in more detail afterwards.

THE CODE…

(ViewController) Header file

  • .h file extension
  • Establishes the controls used in the app’s interface, in this example the label and the button controls. It kind of serves as the link between your user interface (i.e. what you created in the xib file) and the app’s main code (i.e. in the implementation file)
  • Sets the name of the controls used and their ‘event’ (to put it into Visual Basic terms), in this case: outlet and action
  • Outlet is tagged with the label. Think of outlet being another way of saying output - the control that we called ‘label’ is designed to display or ‘output’ text
  • Action is tagged with the button. This tells Objective-C that when a button is clicked something will occur – this is the ‘action’

Note that other than the setup of controls in this project, no other code goes into the header file. How these controls will be used is written in the implementation file.

Hello World - Header codeIBOutlet UILabel *label; creates an instance of a label object in the header file.

  • IBOutlet is short for Interface Builder Outlet - that is, what follows is related to an object that you clicked and dragged from the utilities panel (in Xcode) to the xib file (i.e. iPhone mockup screen).
  • UILabel states that the outlet object being linked from the xib (interface) file to the header file is a label
  • *label; is the name of the instance of a label object. In this example our label instance is also called label, but we could have called it anything we wanted to…
In short, IBOutlet UILabel *label; is making a connection between the iPhone interface created in the xib file and the project’s code setup in the header file. Thus…
Create an instance of a label object called (in this particular example), ‘label’

- (IBAction)button:(id)sender; creates an instance of a button object.

  • - (IBAction)button: indicates that the object created will perform some kind or behaviour or ‘action’. In this example, a button object (called ‘button’ in this case) is being instantiated.
  • (id)sender; tells Xcode that the button will send messages, when clicked, to the button’s method, which we’ll create next in the implementation file.

(View Controller) Implementation file

  • .m file extension
  • Contains the majority of the code in a project
  • Indicates what will happen, exactly, when the end-user touches the button

Hello World - getting the button object to do something!

  • So this code is within a method (that is, one or more statements that outline what will happen when the method is executed).
  • A method encloses it’s statements within curly braces { }
  • One or more statements can be written inside the curly braces
  • Each statement is like a one line instruction to the compiler
  • Each statement ends with a semi-colon ;

Finally, what we’re adding to the end of the implementation file in this project is the button’s method (i.e. the code that will run (yes, even if it is only one line!) when the button is clicked.

Objective-C says - (IBAction)button:(id)sender {

Visual Basic .Net says something like Private Sub myButton_Click… etc

Objective-C says label.text = @”Hello World”;

Visual Basic .Net says something like lblOutput.Text = “Hello World”

We’ll extend the Hello World example to include capturing user input in the next tutorial, Xcode for beginners 03 – Using a text box to input data

Don’t forget to subscribe to this blog, so that you can follow each tutorial as they’re posted! :)

About these ads
 
6 Comments

Posted by on January 16, 2012 in iDevices, iOS, Programming, Software, Xcode

 

Tags: , , ,

6 responses to “Xcode for beginners 02 – Hello World

  1. Paul

    January 30, 2012 at 11:59 am

    Hello Jenny!

    Thanks for this really simple tutorial! It’s much better than one from an XCode tutorials app I waisted £20 for from the App Store because the author is using an earlier version of XCode 4.

    Although I still might use his app from time to time because there are still some useful aspects of it, I prefer your teaching methods and would like to see some more tutorials from you and really appreciate how you post explanations of whats going on to your site as well, which I like very much too!

    Much appreciated, keep ‘em coming!

     
    • Jenny

      February 9, 2012 at 6:49 am

      Thanks for the encouragement, Paul. Much appreciated!
      Glad you’ve found the tutorials useful. More will come, for sure! :)

       
  2. Vikram

    February 16, 2012 at 6:29 pm

    Hi Jenny

    I found your tutorial to be simple and easy.I finally was able to figure out the navigation and controls of the Xcode. Please do post more blogs on more complex apps so that beginners like me will get more familiarized with Xcode. Thanks a lot! Eagerly waiting for your next one.

     
    • Jenny

      February 24, 2012 at 2:55 pm

      Thanks for the support, Vikram! :)

       
  3. Ian

    March 19, 2012 at 7:29 am

    Many thanks for the tutorial – your style works well. I downloaded the Rory Lewis book (complete with about 101 typos :-) ) and have been making some progress. I want to create a simple reference book style app with lists, keys, glossary etc. – should be do-able but any advice on how best to approach it would be appreciated!
    Look forward to part 3 of your series.
    Cheers
    Ian

     
    • Jenny

      June 10, 2012 at 9:58 pm

      Hi Ian

      Yes, the Rory Lewis book could have had better proofread. What really annoyed me after a while with that book though was how much waffle there was – how many times does the reader have to be told just to accept what he has and wait for an explanation later. Enough already!

      I’m hoping to get back into some tutorials when term finishes in NZ in 2 weeks time. I’ve just been so busy with other projects this semester that it’s fallen by the wayside.

      What I’d recommend though is to invest a decent amount of time in planning your app first. Dare I say it, this may even involve pen and paper! :)
      Critique similar apps (or simple ones that take your fancy for whatever reason). How have they used colour? What’s their menu system like? Does the user have to delve through layers to get to what they want or is there a pull-out panel like on Twitter. Will the app’s data be stored externally in a database (i.e. the user will need an Internet connection) or hosted within the app itself.

      Like web design, where the HTML page is only 10% of the effort that’s gone into the website, I see planning an app’s user interface and workflow to be crucial if one is to be success, whether it’s a paid or free app.

       

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
Follow

Get every new post delivered to your Inbox.

Join 1,433 other followers

%d bloggers like this: