使用ForEach循环制作多行Component（）吗？ [SwiftUI]

Question

我有一个循环显示所有MyView（）元素：

HStack() {
    ForEach(datastore.datacard) { data in
        MyView()
    }
}

但是我想在屏幕上每行最多包含4个MyView（）项目，我列出了10个元素，但我不想使用ScrollView。我不知道，就像在每个4个元素上触发Hstack（）一样？

有可能吗？

谢谢

Answer 1

有一个ForEach的初始化程序，采用Range：https://developer.apple.com/documentation/swiftui/foreach/3364099-init

ForEach(0..<4) { index in
    MyView()
}

如果您需要访问ForEach内部datastore.datacard中提供的数据，则可以通过索引访问数据：

ForEach(0..<(datastore.datacard.count < 4 ? datastore.datacard.count : 4)) { index in
     MyView(self.datastore.datacard[index])
}

Answer 2

首先，您需要使用此扩展名将数据数组拆分为多个块：

extension Array {
    func chunked(into size: Int) -> [[Element]] {
        return stride(from: 0, to: count, by: size).map {
            Array(self[$0 ..< Swift.min($0 + size, count)])
        }
    }
}

然后您可以设置数组大小：

let chunksResult = datastore.datacard.chunked(into: 4)

对于UI，请尝试此

VStack {
      ForEach(chunksResult) { rowData in
          HStack {
              ForEach(rowData) { columnData in
                  MyView()
              }
          }
      }
  }

这是示例代码，需要在Xcode中进行测试，我只是编写代码以了解如何进行管理的线索