我正在尝试对齐HStack中的图像，但是stack下的HStack图像不工作。
代码：-
struct ImageStackRoundUpr: View {
var friendImages = ["DTR-CentrImg.jpeg", "1frame_0_delay-0.07s", "frame_7_delay-0.07s"]
var body: some View {
HStack(spacing:-6) {
Group {
ForEach(friendImages.indices, id: \.self) { i in
Image(friendImages[i])
.resizable()
.frame(width: 40, height: 40)
.clipShape(Circle())
.overlay(Circle().stroke(Color.gray, lineWidth: 1))
.zIndex(Double(friendImages.count - i))
}
ForEach(self.friendImages.indices, id: \.self) { i in
Image(friendImages[i])
.resizable()
.frame(width: 40, height: 40)
.clipShape(Circle())
.overlay(Circle().stroke(Color.gray, lineWidth: 1))
.zIndex(Double(friendImages.count - i))
}
ForEach(self.friendImages.indices, id: \.self) { i in
Image(friendImages[i])
.resizable()
.frame(width: 40, height: 40)
.clipShape(Circle())
.overlay(Circle().stroke(Color.gray, lineWidth: 1))
.zIndex(Double(friendImages.count - i))
}
}
Spacer()
}.padding(.vertical)
}
}
输出：-
我的目标：-
有人能给我解释一下如何在HStack下显示图像吗？我已经试着用上面的方法实现了，但是还没有结果。
如有任何帮助，将不胜感激。
提前道谢。
使用zIndex您就可以做到这一点
struct ImageStackRoundUpr: View {
var friendImages = ["1", "2", "3", "4", "5"]
var body: some View {
HStack(spacing: -10.0) {
ForEach(friendImages.indices, id: \.self) { index in
Image(friendImages[index])
.resizable()
.scaledToFit()
.frame(width: 80, height: 80)
.background(Color.gray)
.clipShape(Circle())
.overlay(Circle().stroke(Color.black, lineWidth: 2))
.zIndex(Double(friendImages.count - index))
}
Spacer()
}
.background(Color.green)
}
}
struct ImageStackRoundUpr: View {
var friendImages = ["1", "2", "3", "4", "5"]
var body: some View {
HStack(spacing: -10.0) {
ForEach(friendImages.indices, id: \.self) { index in
Image(friendImages[index])
.resizable()
.scaledToFit()
.frame(width: 50, height: 50)
.background(Color.gray)
.clipShape(Circle())
.overlay(Circle().stroke(Color.black, lineWidth: 1))
.zIndex(Double(friendImages.count + friendImages.count - index))
}
ForEach(friendImages.indices, id: \.self) { index in
Image(friendImages[index])
.resizable()
.scaledToFit()
.frame(width: 50, height: 50)
.background(Color.gray)
.clipShape(Circle())
.overlay(Circle().stroke(Color.black, lineWidth: 1))
.zIndex(Double(friendImages.count - index))
}
Spacer()
}
.background(Color.green)
}
}
