© Stefan Kaczmarek, Brad Lees, Gary Bennett 2019
Stefan Kaczmarek, Brad Lees and Gary BennettSwift 5 for Absolute Beginnershttps://doi.org/10.1007/978-1-4842-4868-3_2

2. Programming Basics

Stefan Kaczmarek1 , Brad Lees1 and Gary Bennett2
(1)
Phoenix, AZ, USA
(2)
Scottsdale, AZ, USA
 

This chapter focuses on the building blocks that are necessary to become a great Swift programmer. This chapter covers how to use the playground user interface, how to write your first Swift program, and how to use the Xcode Integrated Development Environment (IDE).

Note

We will introduce you to using playgrounds, which will enable you to program right away without worrying about all of the complexities of Xcode projects. We use this approach to help you learn the concepts quickly, without discouragement, and to give you a great foundation to build upon.

Touring Xcode

Playgrounds in Xcode make writing Swift code incredibly simple and fun. Type a line of code, and the result appears immediately. If your code runs over a period of time, perhaps in a loop or branch, you can watch its progress in the timeline area. When you’ve completed your code in the playground, it is easy to move your code to a Swift iOS project. With Xcode playgrounds, you can do the following:
  • Design or modify an algorithm, observing the results every step of the way

  • Create new tests, verifying that they work before promoting them into your test suite

First, you’ll need to learn a little more about the Xcode user interface. When you open an Xcode iOS project, you are presented with a screen that looks like Figure 2-1.

The Xcode user interface is set up to help you efficiently write your Swift applications. The user interface helps new programmers learn the user interface for an iOS application. You will now explore the major sections of Xcode’s IDE workspace and playgrounds.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig1_HTML.jpg
Figure 2-1.

Xcode Integrated Developer Environment with a Swift project

Exploring the Workspace Window

The workspace window, shown in Figure 2-2, enables you to open and close files, set your application preferences, develop and edit an app, and view the text output and error console.

The workspace window is your primary interface for creating and managing projects. The workspace window automatically adapts itself to the task at hand, and you can further configure the window to fit your work style. You can open as many workspace windows as you need.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig2_HTML.jpg
Figure 2-2.

Xcode’s workspace window

The workspace window has four main areas: Editor, Navigator, Debug, and Utility.

When you select a project file, its contents appear in the Editor area, where Xcode opens the file in the appropriate editor.

You hide or show the other three areas by using buttons in the view selector in the toolbar. These buttons are in the top-right corner of the window.
  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figa_HTML.gif Clicking this button shows or hides the Navigator area. This is where you view and maneuver through files and other facets of your project.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figb_HTML.gif Clicking this button shows or hides the Debug area. This is where you control program execution and debug code.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figc_HTML.gif Clicking this button shows or hides the Utility area. You use the Utility area for several purposes, most commonly to view and modify attributes of a file.

Navigating Your Workspace

You can access files, symbols, unit tests, diagnostics, and other features of your project from the Navigator area. In the navigator selector bar, you choose the navigator suited to your task. The content area of each navigator gives you access to relevant portions of your project, and each navigator’s filter bar allows you to restrict the content that is displayed.

Choose from these options in the navigator selector bar:
  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figd_HTML.gif Project navigator: Add, delete, group, and otherwise manage files in your project; or choose a file to view or edit its contents in the editor area.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Fige_HTML.gif Source Control navigator: View the detailed history of changes you have made to your project files when using a Version Control System (VCS) like Git.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figf_HTML.gif Symbol navigator: Browse the class hierarchy in your project.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figg_HTML.gif Find navigator: Use search options and filters to quickly find text within your project.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figh_HTML.gif Issue navigator: View issues such as diagnostics, warnings, and errors found when opening, analyzing, and building your project.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figi_HTML.gif Test navigator: Create, manage, run, and review unit tests.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figj_HTML.gif Debug navigator: Examine the running threads and associated stack information at a specified point of time during program execution.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figk_HTML.gif Breakpoint navigator: Fine-tune breakpoints by specifying characteristics such as triggering conditions and see all your project’s breakpoints in one place

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figl_HTML.gif Report navigator: View the history of your builds.

Editing Your Project Files

Most development work in Xcode occurs in the Editor area, which is the main area that is always visible within the workspace window. The editors you will use most often are as follows:
  • Source editor: Write and edit Swift source code.

  • Interface builder: Graphically create and edit user interface files

    (see Figure 2-3).

  • Project editor: View and edit how your apps should be built, such as by specifying build options, target architectures, and app entitlements.

When you select a file, Xcode opens the file in an appropriate editor. In Figure 2-3, the file Main.storyboard is selected in the Project navigator, and the file is open in Interface Builder.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig3_HTML.jpg
Figure 2-3.

Xcode’s Interface Builder showing a storyboard file

The editor offers three controls:
  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figm_HTML.gif Clicking this button opens the Standard editor. You will see a single editor pane with the contents of the selected file.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Fign_HTML.gif Clicking this button opens the Assistant editor. You will see a separate editor pane with content logically related to that in the Standard editor pane.

  • ../images/341013_5_En_2_Chapter/341013_5_En_2_Figo_HTML.gif Clicking this button opens the Version editor. You will see the differences between the selected file in one pane and another version of that same file in a second pane. Used when working with source control.

Creating Your First Swift Playground Program

Now that you have learned a little about Xcode, it’s time to write your first Swift playground program and begin to understand the Swift language, Xcode, and some syntax. First, you have to install Xcode.

Installing and Launching Xcode 10.2

Xcode 10.2 is available for download from the Mac App Store for free, as shown in Figure 2-4.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig4_HTML.jpg
Figure 2-4.

Xcode 10.2 is available for download from the Mac App Store for free

Note

This package has everything you need to write iOS, watchOS, tvOS, and macOS apps. To publish apps on the iOS or macOS App Stores, you will need to apply for the Apple Developer Program and pay $99 when you’re ready to submit. Figure 2-5 shows the Apple Developer Program web site at https://developer.apple.com/ .

../images/341013_5_En_2_Chapter/341013_5_En_2_Fig5_HTML.jpg
Figure 2-5.

The Apple Developer Program

Now that you have installed Xcode, let’s begin writing a Swift playground.
Launch Xcode and click “Get started with a playground,” as shown in Figure 2-6.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig6_HTML.jpg
Figure 2-6.

Creating your first Swift playground

Using Xcode 10.2

After a new Xcode window opens, follow these steps:
  1. 1.

    Select a Blank iOS template and click Next, as shown in Figure 2-7.

     
  2. 2.

    Name the playground HelloWorld and create it in a folder of your choice, like Documents or the Desktop.

     
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig7_HTML.jpg
Figure 2-7.

Choosing a Blank iOS playground template

Xcode does a lot of work for you and creates a playground file with code ready for you to use. It also opens your playground file in your Xcode editor so you can start, as shown in Figure 2-8.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig8_HTML.jpg
Figure 2-8.

The playground window

You now need to become familiar with the Xcode playground IDE. Let’s look at two of the most often used features:
  • The Editor area

  • The Results area

Xcode Playground IDE: Editor and Results Areas

The Editor area is the business end of the Xcode playground IDE—where your dreams are turned into reality. It is where you write your code. As you write your code, you will notice it changes color. Sometimes, Xcode will even try to autocomplete words for you. The colors have meanings that will become apparent as you use the IDE. The Editor area is also where you will debug your code.

Note

Even if we’ve mentioned it already, it is worth saying again: You will learn Swift programming by reading this book, but you will really learn Swift by writing and debugging your code. Debugging is where developers learn and become great developers.

Let’s add a line of code to see the power of Swift playgrounds. Add the following code at the end of the file, on line 4:
print(str)

As soon as you enter the line of code, Xcode automatically executes the line and shows the result, “Hello, playground\n”.

When you write Swift code, everything is important—commas, capitalization, and parentheses. The collection of rules that enable the compiler to compile your code to an executable app is called syntax.

Line 3 creates a string variable called str and assigns “Hello, playground” to the variable.

Line 4 prints the str string variable to the Results Area.

Let’s create a syntax error by changing line 4 to print(stz) as shown in Figure 2-9.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig9_HTML.jpg
Figure 2-9.

The playground with a syntax error caught by the Swift compiler

In Swift, print is a function that will print the contents of its parameters in the Results area. As you enter code, the Results area automatically updates with the results for each line of code that you entered.

Now, let’s fix the app by spelling the str variable correctly, as shown in Figure 2-10.
../images/341013_5_En_2_Chapter/341013_5_En_2_Fig10_HTML.jpg
Figure 2-10.

Syntax error fixed

Feel free to play around and change the text that is printed. You may want to add multiple variables or add two strings together. Have fun!

Summary

In this chapter, you built your first basic Swift playground. We also covered new Xcode terms that are key to your understanding of Swift.

The concepts that you should understand are as follows:
  • Playground

  • Editor area

  • Results area

Exercise

  • Extend your playground by adding a line of code that prints any text of your choosing.