How to use LazyHGrids in SwiftUI
Think of them as horizontal scrolling CollectionViews
At the recent WWDC 2020, Apple introduced a LazyHGrid
. A lot of developers found that SwiftUI was missing the support of CollectionView when it was first introduced. With the release of LazyHGrid
, you may now mimic the same behaviour as UICollectionView in UIKit.
“A container view that arranges its child views in a grid that grows horizontally, creating items only as needed.” — Apple Developer
Prerequisites
To follow along with this tutorial, you’ll need some basic knowledge in:
- Swift
- At least Xcode 12+
Note: This only supports iOS 14+.
Getting Started With LazyHGrid
As you probably noticed, the Lazy
prefix basically indicates that the view is only rendered when it appears on the screen, which boosts performance. You don't want to load all 1,000 data at the same time. With LazyHGrid
, you only load however many data that appear on the screen.
To make things more interesting, let’s make up a storyline. Tesla is having a competition to hire an iOS engineer, and…