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 个地球 Logo 图像，但您只能看到 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)
}