SwiftUI (programming language)

SwiftUI is an alternative to UIKit. The difference is that SwiftUI is a declarative way to develop an interface, it allows you to layout the screen by adding different elements to the View hierarchy on the screen :) In other words, in SwiftUI we can describe which View we want, in which View it is will be located and generally arrange different Views in the way they should be located relative to each other. This method greatly simplifies the development of the User Interface.

What does declarative way mean? This is a way when you can describe a view like this: At the top of this view is a text field, in the middle is a button, and at the bottom is a picture. And write it in the code without any extra operations and configuring different elements.

Let me remind you that UIKit is an interactive method of laying out the user interface. In order for us to add a new element to UIKit, we first had to create it, then add it to the hierarchy, then fix it with constraints. In SwiftUI, this is simplified by the declarative way of describing the interface.

As you already understood, in SwiftUI all views are configured and customized using different modifiers. Location is a modifier, size is a modifier, color is also a modifier))

All these modifiers are written for the element through a dot, for example:

Text("Hello")

     .padding()

     .foregroundColor(.green)

There is nothing difficult here and knowledge of all these modifiers will come with experience.

I recommend taking a course on SwiftUI from Apple.

P.S. Read all descriptions of each step carefully. To understand what's going on there.

SwiftUI has all sorts of cool containers for creating interface composition, which we'll talk about today. This greatly simplifies the work with layout compared to UIKit...now you realize it :)

For starters, SwiftUI has stacks for arranging elements. There are three types of stacks: VStack, HStack, ZStack.

• VStack - for arranging elements vertically;
• HStack - for arranging elements horizontally;
• ZStack - for positioning Views on top of each other.

The picture below, which I took from the documentation, shows very clearly how your views will be located in different stacks.

When you create a Stack by default, it centers all the elements and inserts a little padding between the child elements. If you configure manually, then with the help of different modifiers you can create a very flexible interface. You can read more about possible modifiers here.

An important correction, these stacks should be used when you have a small number of Views on the screen and they fit into the display on one screen (if you do not use ScrollView), or all sizes of child views are known. If you have a lot of elements planned on the screen and you want them to scroll, then you need to use LazyVStack, LazyHStack. In Lazy stacks, views inside the stack are not created, which means they do not load memory until they are visible ... everything is logical :)

The technical difference between lazy stacks and ordinary stacks is that when using ordinary stacks, you immediately know all the sizes, indents, etc. of child views, this allows you to create smooth interfaces. When using lazy stacks, the size and position of each of the child views is calculated dynamically, which allows you to change the size, for example, for nested text, but then you sacrifice performance. This must be understood!

In any case, when creating an interface, you need to think about what element you will use. SwiftUI provides many features for working with view compositions, such as stacks, grids, list and others.

In any case, when creating an interface, you need to think about what element you will use. SwiftUI provides many features for working with view compositions, such as stacks, grids, list and others.

Continued at the links below.