Chapter 1: SwiftUI Basics

When Apple announced SwiftUI at WWDC in June, I was fortunate enough to be there. As soon as Apple presented SwiftUI, I was like a kid in a candy store because one of my biggest passions in iOS is working on the visual side. I love being able to take a design and try to come as close as I can to matching every detail of a designer's composition. The biggest downfall of using storyboards, which I am still a fan of, is that you cannot quickly prototype. I have ways of doing it, but it takes time, and sometimes you want to go in and try something and not spend a lot of time setting things up like Collection views or Table views with data. SwiftUI helps me focus on creating a beautiful design without needing any data, and when I am ready, I can plug in data. I find this to be the best process because I can add the data layer after completing the design.

I enjoyed designing all six apps that we will cover in this book. I tried to cover a wide range of topics with these six apps. We will build two watch apps, two iPhone apps, and two iPad apps. Most of these features are available on any device; I decided to mix up the apps so that there was a little variety. One thing about this book that might be slightly different is that I have set up the book so we cover design first. After that, we'll focus on the data side. If you do not care about design, you can easily skip this part. Do what you feel is best for you.

In this chapter, we will be working with the following:

• Views and controls
• Shapes
• View layout and presentation

Views and controls are a crucial part of SwiftUI. Some of them you'll be familiar with if you have done iOS development before. Shapes in SwiftUI are super easy to create and use, and once you are comfortable with them, we'll add animations to them to bring them to life. We'll look at Rounded Rectangles, Rectangles, Circles, and even creating Activity Rings later in the book. Finally, view layout and presentation is a big part of SwiftUI, and we'll cover a ton of ways to make beautiful designs and recreate them in SwiftUI.

In this chapter's sample files, you will find a project called SwiftUIBasics. You can follow along with all of the code examples in that file. Since we will be doing a ton of writing, I designed this chapter for you to follow along with me.

In the SwiftUIBasics project, you will see three folders: Views and Controls, Shapes and View Layout, and Presentation. Each folder has all of the completed code, so you can just follow along. Feel free at this time to play around with modifiers. If you are new to programming, just type a . at the end of the line, and you will see a list of other modifiers you can add on.

If you want to type out each example, please feel free to follow along by creating a new project and just create a new SwiftUI file for each step.

You will notice ContentView in this app, but you can ignore it as we will not be using this file in this chapter. ContentView is the default view that you see when you create a new project. We are not going to cover all views and controls in this chapter, but we will cover most of them at some point in this book.