SwiftUI 用图像包装 HStack

Question

我正在尝试制作一个包含 x 个图像的 HStack，并将以包装 HStack 方式显示它们（即，如果 7 个图像中只有 4 个适合该行，则将剩余的 3 个溢出到下一行） .

我正在尝试使用库 WrappingHStack (https://github.com/dkk/WrappingHStack)，但结果与预期不符，图像未环绕。

这是我的代码：

    @State var numEarths : Int = 7;
    var body: some View {
        VStack{
        
            Text("If everyone were to live like you, we would need \(numEarths) Earths").font(.title)
            WrappingHStack{
                ForEach(0 ..< numEarths){_ in
                Image("logo")
                
                }
             }
         }
    }

这是模拟器上的结果（请参阅，没有包装）...我们应该看到 7 个地球徽标图像，但您只能看到 4 个（以及数字 5 的一小部分）。 screenshot of image

请有人帮我解决这个问题吗？我是 SwiftUI 开发人员的新手，所以如果这是一个愚蠢的错误，请轻视我。谢谢。

Answer 1

根据WrappingHStack库，如果你想实现你上面提到的，你需要做两件事：

• 给您的Image 一个frame，以便WrappingHStack 可以知道每行要放入多少元素。
• 将ForEach 循环更改为WrappingHStack，因为WrappingHStack 可以用作ForEach 来循环遍历项目。

WrappingHStack(0..<numEarths, id:\.self) { _ in
    Image("logo")
        .resizable()
        .frame(width: 100, height: 100)
}