SwiftUI（一）- VStack、HStack、ZStack布局

SwiftUI是什么

懶得寫，直接找了一篇博客: 初識 SwiftUI

三種布局

SwiftUI包括三種布局：

• VStack: 縱向布局，默認居中對齊
• HStack: 橫向布局，默認居中對齊
• ZStack: 覆蓋布局，默認居中對齊

示例

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            //HStack:縱向布局，默認居中對齊
            VStack(alignment: .trailing, spacing: 10) {
                Text("縱向布局").padding(10)
                Text("縱向布局2333").padding(10)
                
            }.border(Color.blue, width: 1)
            //HStack:橫向布局，默認居中對齊
            HStack(alignment: .center, spacing: 20) {
                Text("橫向布局1").padding(10)
                Text("橫向布局2").padding(10)
            }.border(Color.yellow, width: 1)
            .padding(10)
            //ZStack:覆蓋布局，默認居中對齊
            ZStack(alignment: .topLeading, content: {
                Image("bg_blue")
                Text("覆蓋布局").padding(20)
            })
        }
        
    }
}

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