一、第一个SwiftUI App程序

import SwiftUI
@main
struct LandmarksApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

• SwiftUI apps用一个遵守App 的协议结构体作为生命周期；
• body属性返回一个、多个屏幕显示内容
• @main标识了app的入口
  —

ContentView.swift
import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, World!”)
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

• 默认SwiftUI 视图文件就定义了两个结构体ContentView和ContentView_Previews
• ContentView是来描述视图的内容和布局的
• ContentView_Previews是用来了定义一个预览视图，也就是将来右侧Canvas将会显示的预览视图
  ContentView是一个遵守View协议的结构体，属性body是一个遵守View协议的不透明类型；body闭包里面返回的就是显示的视图

二、Text View

显示一行或者多行文字的只读View，也就是UIKit中的UILable

struct ContentView: View {
    var body: some View {
            Text("你好世界”)
            .font(Font.system(size: 30))
            .foregroundColor(Color.red)
            .padding(EdgeInsets.init(top: 10, leading: 10, bottom: 10, trailing: 10))
            .background(.green)
    }
}

struct ContentView: View {
    var body: some View {
            Text("你好世界啊啊啊”)
            .font(Font.system(size: 20))
            .foregroundColor(Color.red)
            .frame(width: 100, height: 60, alignment: .leading)
            .background(.green)
            .lineLimit(nil)
    }
}

• 1、func frame(width: height: alignment: ) -> some View 可以设置Text内容的对齐方式和大小
• 2、SwiftUI中frame不同于UIkit,只表示了大小，没有x,y
• 3、func lineLimit(_ number: Int?) -> some View,用来限制文本的显示行数。
  number = nil就不会限制；number= 0只会显示一行； Text默认是不限制行
• 4、SwiftUI的视图内容默认都是居中显示在屏幕内。

三、 VStack 和HStack

当创建一个SwiftUI view时，只需要在 ContentView的 body属性里面对这个view描述内容、布局就好了，但是 body属性只能返回单独的一个view。为了可以在body属性里面描述多个View,我们可以用stacks，将多个View组合在一起。

1、VStack

截屏2021-11-26 下午2.33.06.png

• VStack可以将多个View沿着竖直方向排布
• spacing参数决定了竖直方向上多个View之间的距离

2、HStack

截屏2021-11-26 下午2.39.57.png

• HStack可以将多个View沿着水平方向排布
• spacing参数决定了水平方向上多个View之间的距离

3、Spacer

A spacer expands to make its containing view use all of the space of its parent view, instead of having its size defined only by its contents.
一个spacer可以扩充空间，让所有的view使用parent view的所用空间，parent view的大小不在由其内容决定。

截屏2021-11-26 下午3.14.40.png
从运行显示结果看，space在中间的时候，会使两边的view推到两侧；space 在左边的时候，会将view推到最右侧；space 在右边的时候，会将view推到最左侧；
通俗点理解：space会使stack充满全屏，space相当于一个虚拟控件一样，占据了剩余的所有空间。
截屏2021-11-26 下午4.23.20.png
总结：SwiftUI的布局不同于UIKit,frame只能提供建议的大小，而通过灵活使用HStack、VStack、Spacer就可以完成大多数布局了。回看一下SwiftUI的布局有点像html的布局一样，Stack就如DIV一样模幻