我正在嘗試創建一個具有 1 行并水平滾動的lazyvgrid，但我必須遺漏一些東西，因為我嘗試的所有內容都會弄亂我的布局。
我想要達到的目標：
像這樣的網格（只有 1 行），能夠水平滾動。
我在做什么：
- 我選擇 LazyvGrid 是因為元素放置在其中的方式。
- 我也嘗試使用 LazyHGrid，因為因為我只需要一行，所以如何將專案放置在網格中并不重要。無論如何，布局看起來很奇怪（我有多行無法洗掉）。
- 考慮一下，盡管我的陣列是靜態的，但在現實生活中它將是動態的
現在我有兩個我不滿意的解決方案：
- 帶有lazyvgrid的那個：
var days: [Int] = [1,2,3,4,5,6,7]
[…]
GeometryReader{ geometry in
ScrollView(.horizontal){
LazyVGrid(columns: [GridItem(.adaptive(minimum: geometry.size.width * 0.12))]) {
ForEach(days[0..<days.count], id: \.self) {focus in
Circle()
.foregroundColor(.yellow)
.frame(width: 50, height: 50, alignment: .center)
}
}
}
}
結果如下：
?
- lazyHgrid 解決方案：
GeometryReader{ geometry in
ScrollView(.horizontal){
LazyHGrid(rows: [GridItem(.adaptive(minimum: geometry.size.width * 0.12))]) {
ForEach(days[0..<days.count], id: \.self) {focus in
Circle()
.foregroundColor(.yellow)
.frame(width: 50, height: 50, alignment: .center)
}
}
}
}
它看起來像這樣 ?
現在，如果我們將最小尺寸更改為 200 或另一個大數字，我會得到 1 行，但集合視圖仍然非常高，而我只希望它與其中的專案一樣高。
供參考，它看起來像這樣：
?
你能解釋一下如何成功地實作我的需要以及為什么會這樣嗎？我真的很想了解更多關于 swiftui 中的網格的資訊，我對 UIKit 中的集合視圖非常好，但對網格沒有同樣的看法令人沮喪……
uj5u.com熱心網友回復：
當您設定定義.frame(width: 50, height: 50, alignment: .center)時，您將不需要GeometryReader.
你可以這樣做：
ScrollView(.horizontal){
LazyHGrid(rows: [ GridItem(.flexible()) ]) {
ForEach(days, id: \.self) {focus in
Circle()
.foregroundColor(.yellow)
.frame(width: 50, height: 50, alignment: .center)
}
}
}
或完全跳過 Grid 并使用LazyHStack，如果您只有一行，這將是更自然的選擇。：
ScrollView(.horizontal){
LazyHStack {
ForEach(days, id: \.self) {focus in
Circle()
.foregroundColor(.yellow)
.frame(width: 50, height: 50, alignment: .center)
}
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/452938.html