我希望能够横向堆叠重叠的元素,如下所示:
这是我尝试过的方法:
struct StackedElementsView: View {
let colors: [Color] = [.red, .blue, .purple]
var body: some View {
HStack {
ZStack {
ForEach(0..<colors.count) { i in
ZStack(alignment: .leading) {
colors[i]
.clipShape(Circle())
.frame(width: 44, height: 44)
}
.offset(x: CGFloat(i) * 25)
}
}
.padding(.leading, 24)
Color.purple
.frame(width: 100, height: 44)
Spacer()
}
.padding(.vertical, 8)
}
}
struct StackedElementsView_Previews: PreviewProvider {
static var previews: some View {
StackedElementsView()
}
}
我有一个问题,紫色矩形重叠在圆圈上面,我不知道为什么。
谢谢你的帮助。
-19
的间距吗?0
的间距将会以宽度44
偏移圆圈,因此为了达到25
的效果,你需要减去19
。 - vacawama