I plan to write a SwiftUI app, so I would like to explore the structure of a SwiftUI app first.
I found this developer document and would like to take note of it.
SwiftUI is a declarative framework that helps you compose the user interface of your app. The principle building blocks that form the structure of a SwiftUI app are the App, Scene, and View protocols. This sample introduces you to these protocols by walking through lines of code, and explaining what’s happening and why.
————————————————————————————————————–
App structure
An app structure describes the content and behavior of your app, and each SwiftUI app has one and only one main app structure. This sample defines its app structure in the MyApp.swift file. Let’s take a look at the contents of that file.
Step 1
To access the symbols and features of SwiftUI, the app uses an import declaration to import the SwiftUI framework.
Step 2
To indicate the entry point of the SwiftUI app, the sample applies the @main attribute to the app structure.
Step 3
The MyApp structure conforms to the App protocol, and provides the content of the app and its behavior.
Step 4
The structure implements the computed property body, which is a requirement of the App protocol.
Step 5
This sample uses a WindowGroup scene to represent the main window that the app displays.
Step 6
The scene contains ContentView, a custom view that creates a view hierarchy that consists of an image and text.
Content view
In SwiftUI, a scene contains the view hierarchy that an app displays as its user interface. A view hierarchy defines the layout of views relative to other views. In this sample, a WindowGroup scene contains the view hierarchy that ContentView composes using other views.
Step 1
The source code begins by importing the SwiftUI framework.
Step 2
ContentView is a structure that conforms to the View protocol.
Step 3
ContentView implements the computed property body, just like the ‘MyApp’ structure does in the previous section.
Step 4
ContentView contains the SwiftUI-provided view VStack, which arranges subviews vertically.
Step 5
The first subview in VStack is Image, a view that displays an image.
ContentView applies the view modifier imageScale(_:) to the image view to scale the image within the view to the relative size Image.Scale.large.
Step 7
The foregroundColor(_:) modifier adds color to the image view.
Step 8
The second subview of VStack is Text, a view that displays one or more lines of read-only text.
Step 9
ContentView applies the padding(_:_:) modifier to the VStack, adding a platform-specific default amount of padding — that is, space — to the edges of the VStack view.
Step 10
When you run the sample app, it displays the scene that contains the view hierarchy described in ContentView.