Swiftui 将懒散网格中的最后一行居中

在

LazyVGrid

中，我显示来自服务器的数据（这里我以字母表为例），如果最后一行包含少于3个项目，我的目标是显示中间的最后一行，而不是

前导

。这可行吗

目前看起来是这样的：

目标：

---

缓慢加载每个单元

struct ContentView: View {
    let alphabet = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
    let preference = [
        GridItem(.flexible()),
        GridItem(.flexible()),
        GridItem(.flexible())
    ]
    var body: some View {
        ScrollView {
            LazyVGrid(columns: preference) {
                ForEach(alphabet.dropLast(alphabet.count % 3), id: \.self) { value in
                    Cell(value: value)
                }
            }
            
            LazyHStack {
                ForEach(alphabet.suffix(alphabet.count % 3), id: \.self) { value in
                    Cell(value: value)
                }
            }
        }
    }
}

提取单元视图以实现重用

struct Cell: View {
    let value: String
    var body: some View {
        print(value)
       return ZStack {
            Rectangle()
                .frame(width: 120, height: 120)
                .foregroundColor(Color(UIColor.systemIndigo))
                .cornerRadius(16)
            Text(value)
                .foregroundColor(.white)
                .font(.title)
        }
    }
}

---

即使设备是横向的，也应该只有3列吗？@Yodagama谢谢你的提问！现在，让我们想想这个应用程序只支持肖像模式。

struct Cell: View {
    let value: String
    var body: some View {
        print(value)
       return ZStack {
            Rectangle()
                .frame(width: 120, height: 120)
                .foregroundColor(Color(UIColor.systemIndigo))
                .cornerRadius(16)
            Text(value)
                .foregroundColor(.white)
                .font(.title)
        }
    }
}