Including HStack's common centering, filling, equalizing and squeezing
code:
import SwiftUI
struct MPMineView: View {
var body: some View {
VStack {
/// 1.单个视图默认居中
HStack {
Label("单个", systemImage: "smallcircle.fill.circle")
.background(Color.red)
}
/// 2.单个视图拉满居左/居中/居右
HStack {
Label("单个", systemImage: "smallcircle.fill.circle").frame(maxWidth: .infinity, alignment: .leading)
.background(Color.red)
}
/// 3.多个视图默认居中
HStack {
Label("左侧", systemImage: "smallcircle.fill.circle")
.background(Color.red)
Text("居中")
.background(Color.green)
Text("右侧")
.background(Color.blue)
}
/// 4.多个视图等分
HStack {
Text("左侧").frame(maxWidth: .infinity, alignment: .leading)
.background(Color.red)
Text("居中").frame(maxWidth: .infinity, alignment: .center)
.background(Color.green)
Text("右侧").frame(maxWidth: .infinity, alignment: .trailing)
.background(Color.blue)
}
/// 5.左右挤压中间视图
HStack {
Label("左侧", systemImage: "smallcircle.fill.circle").frame(maxWidth: .infinity, alignment: .leading)
.background(Color.red)
Text("居中")
.background(Color.green)
Text("右侧").frame(maxWidth: .infinity, alignment: .trailing)
.background(Color.blue)
}
/// 6.左右挤压中间多个视图
HStack {
Text("左侧").frame(maxWidth: .infinity, alignment: .leading)
.background(Color.red)
Text("居中1")
.background(Color.green)
Text("居中2")
.background(Color.green)
Text("右侧").frame(maxWidth: .infinity, alignment: .trailing)
.background(Color.blue)
}
/// 7.多个等分挤压某个视图
HStack {
Text("左侧").frame(maxWidth: .infinity, alignment: .leading)
.background(Color.red)
Text("居中1").frame(maxWidth: .infinity, alignment: .center)
.background(Color.green)
Text("居中2")
.background(Color.green)
Text("右侧").frame(maxWidth: .infinity, alignment: .trailing)
.background(Color.blue)
}
}
}
}
hint: