Displaying tabular content with LazyHGrid and LazyVGrid
Like lazy stacks, lazy grids also use lazy loading to display a collection of items. They only initialize a subset of items that will soon be displayed on the screen when the user scrolls. You can display content from top to bottom using a LazyVGrid
view and from left to right using a LazyHGrid
view.
In this recipe, we’ll use the LazyVGrid
and LazyHGrid
views to display an extensive range of numbers embedded in colorful circles.
Getting ready
Create a new SwiftUI app called LazyGrids
.
How to do it…
We’ll use a ForEach
structure count for numbers from 0 to 999 and display them in a LazyHGrid
, then repeat similar steps to display the numbers in a LazyVGrid
view. The steps are as follows:
- In the
ContentView
struct, just above thebody
variable, create an array ofGridItem
columns. TheGridItem
struct helps configure the layout of the lazy grid:let columnSpec = [ ...