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)
}

SwiftUI 用图像包装 HStack

SwiftUI Wrapping HStack with Images

swift

swiftui

hstack