视图排列

VStack 竖直排列

• alignment:对齐方式, spacing:组件间隔

VStack(alignment: .leading,spacing: 20, content: {
    Text("稻妻")
        .font(.title)
        .foregroundColor(.cyan)
    Text("御建鸣神主尊大御所大人")
        .font(.headline)
        .foregroundColor(.accentColor)
})
.background(.orange)
.padding(20)
.cornerRadius(20)

水平排列

HStack {
    Spacer()
    Text("蒙德")
        .foregroundColor(.blue)
    Spacer()
    Text("璃月")
        .foregroundColor(.orange)
    Spacer()
    Text("稻妻")
        .foregroundColor(.purple)
    Spacer()
    Text("须弥")
        .foregroundColor(.green)
    Spacer()
}

z轴排列

ZStack {
    Text("八重神子")
        .padding(10)
        .background(Color.red)
        .opacity(0.5)
            
    Text("雷电将军")
        .foregroundColor(.white)
        .padding(20)
        .background(Color.red)
        .offset(x: 0, y: 40)
}