🖼️Grids

SwiftUI ⟩ Layout ⟩ Grids ⟩

🔴 主題

• Grid - ⭐️ iOS 16 feature.

• grid layout algorithm

• Grids ⟩ examples

• GridItem

  • flexible column

  • adaptive column

⭐️ 重點

To make grids scrollable, they must be wrapped inside a ScrollView with the appropriate axis. 👉 SwiftUI Lab

the minimum property of an adaptive column is only used to compute the number of items inside that column, it's NOT the minimum width of that column❗️ ( 👉 Adaptive Column 💈例二 )

💈範例

• NColumns - introduction to LazyVGrid

• adaptive column - how adaptive column behaves.

• TestSVGFE - test ScrollVGridForEach.

📘 手冊

• SwiftUI ⟩ View Layout and Presentation ⟩

  • LazyVGrid (struct)

  • LazyHGrid (struct)

  • GridItem (struct) - control alignment, spacing, size (width or height).

📗 參考

• Paul ⟩ How to position views in a grid using LazyVGrid and LazyHGrid

• SwiftUI Lab ⟩ Impossible Grids with SwiftUI ⭐️

• WWDC2020 ⟩ Stacks, Grids, and Outlines in SwiftUI

• Riyam ⟩ Understanding the SwiftUI grid layout

• objc ⟩ SwiftUI’s Grid Views ⭐️⭐️ - how flexible/adaptive columns behave.

👥 相關

• - LazyGrids 通常包在 ScrollView 裡面。

• Grid - custom grid layout.

• Cannot convert value of type 'Self' to expected argument type 'Binding<C>' ⛔️ error occurred when designing layout protocol.

🗣 討論

• LazyVGrid Items Overlap

🖥️ 影片

tundsdev ⟩ Grids in SwiftUI (SwiftUI Grids, SwiftUI LazyVGrid, SwiftUI LazyHGrid)