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()
    }
}