Download code from GitHub
Understanding Declarative Syntax
In this chapter, you'll learn about the core fundamentals of the declarative syntax. You'll be able to identify and understand the theory behind it and the part it plays in SwiftUI development. We'll look specifically at how the syntax is written and how easily it can be intercepted and edited in a live debugging environment, all within Xcode. We'll finish off by going deeper into the structure of the syntax and understand how it all binds together. By the end of this chapter, you'll be able to fully understand what advantages are on offer, along with how to comfortably write a basic UI using declarative syntax.
Without declarative syntax, there would be no SwiftUI, or it would simply be another UIKit forcing users to learn a new framework with the same base language. Due to this, it is important to learn the fundamentals...
Technical requirements
For this chapter, you'll need to download Xcode version 11.3 or above from the Apple Mac App Store. You'll also need to be running the latest version of macOS (Catalina or above). Simply follow these steps:
- Search for Xcode in the App Store and select and download the latest version.
- Launch Xcode and follow any additional installation instructions that your system may prompt you for.
- Once Xcode has been fully launched, you're ready to go!
What is declarative syntax?
In this section, you'll learn what declarative syntax is and what immediate benefit it offers for writing clean code. You'll also learn about its counterpart imperative syntax in order to gain understanding from both paradigms.
The declarative syntax is a programming paradigm that allows you to write code in a more formal and procedural way. In essence, the declarative syntax is a way of describing the code you want to write, without having to worry about how it's going to be implemented.
The following is an example of declarative syntax if it was said in spoken language:
This is more of a statement than written logic as we are asking for something rather than being concerned about how we are going to get it.
Let's take our first look at SwitUI syntax. Here, we have created a Text Label...
Visualizing declarative syntax
As we mentioned in the previous chapter, declarative syntax is used by many languages. A relatively recent framework, Google's Flutter, took on the declarative syntax approach and the wider developer community was immediately hooked. With this, it was only a matter of time before other frameworks started to follow.
Now, let's take our first steps into programming with SwiftUI. We'll start by getting to grips with Xcode, learn the basics of how to create a new project, and start to write our very first SwiftUI code!
Getting started with SwiftUI in Xcode
Nesting and decoration
Just from the examples in the previous section, you've seen the immediate benefit of not only SwiftUI but how it uses the declarative syntax to create Views and add them to your application.
In this section, we are going to dive a little deeper down the rabbit hole and look at how declarative syntax makes use of modifiers to decorate our Views and how to best handle adding multiple Views inside each other without getting into too much trouble.
Modifiers
Modifiers in SwiftUI are a simple yet effective way of rendering custom interactions and decoration. Let's take our previous example, add some basic modifiers, and see what we get:
struct ContentView: View {
var body: some View {
...Imperative syntax
Imperative syntax is the more common form of programming that's used as it's much more functional and requires the programmer to write code that will tell the compiler how we are going to achieve the goal, rather than ask politely. The following is an example of imperative syntax:
Even with the preceding example, we could dig even deeper and say "I need some water, then boil the water" or "type or brand of sugar".
Let's take a look at the following Swift code. This is a typical class you may see when writing a standard Swift app. Take a closer look at the makeBrew() function and how each step is coded so that the compiler knows...
Summary
In this chapter, we learned how declarative syntax allows the developer to write syntax in a way that describes the actions and functions required and how its counterpart, imperative programming, is more logic-based.
We learned about the structure of declarative syntax and how understanding the view hierarchy is important to us, especially as every component on the screen is of the View type.
We also got to use SwiftUI for the first time in Xcode and took our first glance at the structure and arrangement that the declarative syntax has to offer, including nesting Views, and the importance of Group containers to arrange our subviews.
In the next chapter, we'll move onto the layout of SwiftUI and understand the structure of not just our code, but the architecture of our code base.
Questions
- Describe declarative syntax.
- What other syntax paradigms can we use?
- What do modifiers do?
- What visual effects do Groups have on our UI?
- When are we forced to use Groups in SwiftUI?
Further reading
- Declarative Programming: https://en.wikipedia.org/wiki/Declarative_programming
- SwiftUI View Modifier: https://developer.apple.com/documentation/swiftui/viewmodifier
- SwiftUI Groups: https://developer.apple.com/documentation/swiftui/group
