Getting Started

Launch XCode and create a new project.

Use the Single View Application as a start.

storyboards-1

storyboards-2

Fill in the template options as follows:

  • Product Name: Ratings
  • Organization Identifier: the identifier that you use for your apps
  • Language: Objective-C
  • Devices: iPhone
  • Use Core Data: not checked (We will be explaining Core Data in another tutorial)
  • Include Unit Tests and UI Tests: not checked (We will be explaining Unit Tests and UI Tests in another tutorial)

After this, the main screen will look like the below screenshot:

storyboards-3

To open the storyboard in the Interface Builder editor, click Main.storyboard in the project navigator

storyboards-4

According to Apple the definition of a storyboard is:

A storyboard is a visual representation of the user interface of an iOS application, showing screens of content and the connections between those screens. A storyboard is composed of a sequence of scenes, each of which represents a view controller and its views; scenes are connected by segue objects, which represent a transition between two view controllers.

Xcode provides a visual editor for storyboards, where you can lay out and design the user interface of your application by adding views such as buttons, table views, and text views onto scenes. In addition, a storyboard enables you to connect a view to its controller object, and to manage the transfer of data between view controllers. Using storyboards is the recommended way to design the user interface of your application because they enable you to visualize the appearance and flow of your user interface on one canvas.

Before you get to exploring, resize the scene to simulate an iPhone 6/6s.

Select View Controller in the editor. If you don’t see a Document Outline, click this button at the bottom left of the storyboard canvas:

storyboards-5

In the Attributes Inspector under Simulated Metrics, change Size to iPhone 4.7 inch (Size of the iPhone 6 and later)

storyboards-6

“Inferred” is the default setting for Simulated Metrics in storyboards. Just remember that they aren’t used during runtime.

To get a feel for how the storyboard editor works, drag some controls from the Object Library in the lower right into the blank view controller:storyboards-7

Once you drag and drop controls in, they will show up on the Document Outline on the left of your screen.

Now to explain the architecture of the project:

Notice how you have an AppDelegate.h as well as another one with a .m extension.
The .h is called the Header file and the .m is called the Implementation file.

Together, they form the AppDelegate class.