Workshop 3: Overview of Xcode 6 IDE & Swift

In this workshop I debrief you on the five main areas of Xcode 6 Integrated Development Editor (IDE for short) and the Swift Programming Language. Xcode 6 IDE is divided up in 5 main areas as shown in the image below.

xcode6-workspace

ideaYou should print this pdf file, Xcode Shortcuts B_W. It is a complete list of Xcode keyboard shortcuts on a single page. The pdf is courtesy of COCOA SAMURAI.

1. Toolbar

Xcode 6 Toolbar look like this:

xcode6-toolbar

The Run button build and run the current project you are working on, in the selected scheme (iOS Simulator or a connected device).

The Stop button terminate the running project. Another way to terminate the project is to use the keyboard  (⌘ + .) shortcut keys.

You use Scheme pop-up menut menu to select where you want Xcode to run the project; in an iOS Simulator or on your connected device. The image below shows how to use the Active Scheme menu. First, you click the Active Scheme, which display a pop up menu. Second, you select an iOS Simulator. If your device is connected to your Mac its name will appear in the list. Third, you click the Run button, which look like a play button. Xcode will build and run your app in the iOS Simulator or your connected device.

xcode6-active-scheme

The Activity viewer is located next to the Activity Scheme and it show progress of tasks currently executing. For example, status messages, build progress, issue icons, and other information about the project is shown in the activity viewer. Clicking an issue icon in the activity viewer, opens the Issues navigator.

xcode6-activity-viewer

You select an editor from the Editor selector. The ones you will use the most are the standard editor and the Assistant Editor.  There are three buttons in the Editor selector and you use them to choose an editing mode.

xcode-editor-buttons Standard editor (left button)
Assistant editor (center button)
Version editor (right button)

There are three buttons in the View selector and you use them to show or hide a view.

xcode6-view-selector Navigator area (left button)
Debug area (middle button)
Utility area (right button)

2. Navigator area

When you create an iOS application and select Swift from the project options Language menu, Xcode 6 setup the project in the Navigator area like Figure A. If you select Objective-C from the options window’s Language menu, Xcode 6 setup the project in the Navigator area like Figure B.

xcde6-proj-navigatorA xcde6-proj-navigatorB
Figure A Figure B

As you can see in  In Figure A above, there’s a header and implementation file for the AppDelegate class and the ViewController class. That’s because you selected Objective-C from the project options Language menu. In Figure B above, there’s no header class file, just one AppDelegate class file, and one implementation class file for adding your code. Fore example, you add code for connecting the view’s controls in the ViewController.swift class file. Also, notice that there’s no main.m file in the swift project’s Supporting Files folder, just an Info.plist file.

3. Editor area

This area of Xcode 6 workspace is for loading code editors and Interface Builder. It is located in the middle of Xcode 6 IDE. For example, when you click the Main.storyboard file, it is loaded in Interface Builder. The image below shows what the storyboard look like in Interface Builder.

xcode6-default-storyboard

The item (wAny hAny) shown below the storyboard scene is called the Size Class control. Use it to show the size classes tool. As you can see in the image below, the size classes tool present a grid for specifying width and heigh combination.

size-class-tool
Figure : size classes tool

This mean you no longer need to create a storyboard for the iPhone device and the iPad device. Instead you use the size classes tool to select a width and hight combination for a generic device, that automatically adapt to various screen sizes and orientations. To see how the user interface layout appears on a specific device, you can preview it within Xcode. No need to run the project in the iOS Simulator project. In an upcoming lesson you will learn how to do that.

4. The Utility Area

The Utility area have two panes and it look like this. It is located on the right side of the Editor area.

xcode6-utility-area

You use the Inspector pane to do things like setting an object’s attributes, changing its size, etc. The Library pane contain objects (also called controls) for designing a view’s user interface. You drag an object from the Library and drop it on the storyboard canvas. You use the Filter bar to quickly locate an object in the Library pane.

5. The Debugger area

The Debugger is a window that’s displayed at the bottom area of Xcode’s Workspace. You can click the Debugger button, on the Toolbar’s View selector to show/hide it. The Debugger window gives you the ability to stop the running app mid-stream, examine the values of variables, and investigate the aftermath of errors that prevent your application from running in the iOS Simulator or your connected device.

xcode6-debugger

Swift

Swift is Apple’s new programming language for coding iOS and OS X applications. In a class file, you can mix swift code with Objective-C and C code. In a playground file, you can test your Swift code before transferring it to your swift class file. Swift have a simpler syntax, which should make it much easier to learn. Swift automatically manages memory using Automatic Reference Counting. Swift still use the Cocoa Touch frameworks.

How the Swift import process work

The Cocoa Touch Frameworks are classes written in the Objective-C Programming Language and you can use them in your Swift class file. However, Swift code is used to access the Cocoa Touch Framework’s classes. This is possible because the compiler converts the Cocoa Touch Framework classes to Swift functions. The conversion process is done when you add a Swift import statement at top of your Swift class file. Now you can use Swift syntax to instantiate objects from an Objective-C class.

Say you wanted to use classes of the UIKit framework in a Swift class file, you’d add this import statement at the top of the Swift class file.

import UIKit

Now, you can instantiate (create) objects from the framework’s classes using Swift syntax. This is possible because the compiler compiles the UIKit Framework’s Objective-C Header Files into Objective-C Modules. These modules are imported into your Swift class file as Swift APIs. Figure 1-1 below shows how the Swift import process works.

swift-import-header-fileSince the Objective-C framework’s classes are now Swift APIs, you can use Swift syntax to access the Objective-C framework’s class. For example; in an Objective-C class file, you use this statement to create and initialize table view object called tableViewObject:

UITableView *tableViewObject = [[UITableView alloc] initWithFrame:CGRectZero style:UITableViewStyleGrouped];

In a Swift class file, you use this Swift statement to create and initialize a table view object:

let tableViewObject: UITableView = UITableView(frame: CGRectZero, style: .Grouped)

That’s pretty much how the compiler import process works to convert Cocoa Touch Framework classes to native Swift functions.

Now, the compiler import process does not convert the C Programming Language APIs to Swift APIs. However you can interact with C APIs within a Swift class file by using the native C syntax. By the way, Swift provide APIs for native C types and the table below list common ones you can use in your Swift class file.

C Type Swift Type
bool CBool
char CChar
hort CShort
int CInt
long CLong
float CFloat
double CDouble

For example; in C, you declare and initialize an integer variable like this:

 int youAge = 53;

Swift’s API for C’s int type is CInt and you use it in your Swift class file like this:

var yourAge:CInt = 53

A few things you should know about Swift

  1. The keyword var is for declaring variables and you don’t have to initialize them right away.
  2. The keyword let is for declaring Swift constants and you must initialize them right away.
  3. A semicolon is not required at the end of a statement; however, it is required when you put multiple statements on a single line.
  4. Swift code are place in a single class file and it file extension is, .swift
  5. When you declare a variable and a constant in a Swift class file, you don’t have to annotate it with a type; the compiler infers its type based on its initial value.
  6. There are only two collection types in the Swift Programming Language: Array and Dictionary. Further more, you can use any Swift type for an Array elements and a Dictionary key-value pairs.
  7. All elements (aka values) of an array must be the same type.
  8. All keys and values of a dictionary must be the same type.
  9. Swift function can return multiple values easily by combining them into a tuple. A tuple is a group of multiple values.
  10. You use only the dot syntax to access a class, a method, and an object’s property.
  11. You can use emoji as a variable name and value, as a constant name and its value, as a class name and it value, as a function name and its return value.