• 10 hours
  • Easy

Free online content available in this course.

course.header.alt.is_video

course.header.alt.is_certifying

Got it!

Last updated on 4/27/23

Hello World!

In this chapter you will launch your app and see it running on your Mac!

Thank you for your enthusiasm!
Thank you for your enthusiasm!

Navigating the files

As you can see in the Finder, Xcode has already generated a number of files for your project. At this time, we will only be using two of them:

  1. ViewController.swift  to write the code

  2. Main.storyboard to create the interface

Introducing the interface builder

We are going to start with the second file of the two mentioned above. Select Main.Storyboard in the Xcode Navigator. You will be presented with the following view:

The Xcode Storyboard
The Xcode Storyboard

This file is called a storyboard. It allows us to create the interface of our application. It contains exactly what the user is going to see on the screen.

In the middle of the screen, you can see a white view that's the size of an iPhone. This is the current interface of our application. It's blank at the moment :'(.

The bottom part of the Utilities panel contains interesting elements. We are going to use them to populate our interface.

Object Library
The Object Library

Hello World!

We are going to choose the 'Label' object to start designing our interface. To add it to our view, simply drag the object from Object Library to the view in the middle of the Editor.

Adding Label to the view
Adding a Label to the view

Now simply double click on the label to edit the text. Let's follow the programming tradition and type "Hello World!".

Why "Hello World!"? The first C program in the book "The C Programming Language" printed "hello world!" on the screen. Since then, it has commonly been used as the first accomplishment to introduce the basic details of a programming language.

Changing the text in a label
Changing the text in a label

Running the simulator

Very well, it's time to launch the application!

Wait, but what if I don't have an iPhone? :waw: Having an actual device for which you're developing is ideal but not absolutely required. Luckily, Xcode comes with a simulating tool. It's called Simulator.  

We are going to do this in the Xcode simulator. You can find it on the toolbar at the top left:

The toolbar presents four controls:

  1. Run, which launches the application on the simulator. 

  2. Stop, which terminates the running application. This option is only enabled when the app is running.

  3. Acty, which provides access to different executable components of our application. (Acty is our only option for this course.)

  4. iPhone 7 Plus, which is a default simulator. Clicking on it will reveal other options currently available in Xcode.

Let's optimize it a bit. Click on "iPhone 7 Plus" to reveal the options:

 

From the drop-down list, choose iPhone 7.

Now click "Run"!

Give Xcode a moment to launch a new window - iPhone 7 Simulator. The new window will repeat the appearance of the iPhone 7. You will observe the launch of your application just like if a user clicked on your app icon on their home screen!

Caption: TADAAA !

Congratulations! You have just officially made your very first application! It's a gift.

I suggest you play a little with our simulator so that you understand that it is almost a real iPhone. The first difference is that we do not have the physical buttons of the phone.

You'll find them all, including the home button at the top of the Hardware menu.

You will then find an interface that looks like this:

"Hello Word!" running in iPhone 7 Simulator!

You perform many action in simulator the same way you would on a real device. It simulates the default applications installed on a device - such as  Safari, Photos, Calendar etc. You can also leave and come back to your Acty app. Take a few minutes to get yourself familiar with this new software. 

I recommend following exercises:

  • Lock iPhone

  • Open it

  • Change its orientation

  • Zooming on a photo (index: the alt key pressed simulates 2 fingers on the simulator)

  • Find your address in plan

Done? Feeling Excited?!

Let's Recap!

  1. We will work with 2 files: main.storyboard and viewcontroller.swift

  2. The storyboard allows you to create interfaces by dragging and dropping elements from the object library onto the the view

  3. Clicking the run button launches the simulator: a simulation of an iPhone in your Mac! We'll use this tool to test our application.

In the next chapter, we will create the interface for Acty!

Ever considered an OpenClassrooms diploma?
  • Up to 100% of your training program funded
  • Flexible start date
  • Career-focused projects
  • Individual mentoring
Find the training program and funding option that suits you best
Example of certificate of achievement
Example of certificate of achievement