LazyVStack
Published Nov 20, 2022
Contribute to Docs
The LazyVStack
view arranges its elements in a line that grows vertically. It has all the properties of a standard VStack
but it will not create items until it needs to be rendered on screen. This is useful when creating long lists and can allow an app to run smoother and faster.
Syntax
var body: some View {
LazyVStack {
Subviews here
}
}
Example
In the example below, a ScrollView
contains a LazyVStack
that consists of a vertical row of text views:
var body: some View {ScrollView(.vertical) {LazyVStack(alignment: .center) {ForEach(1...100, id: \.self) {Text("Row \($0)")}}}}
ScrollView()
displays the content within the scrollable region and adjusts what portion of the content is visible. Here, the axis is set to.vertical
, which allows for vertical scrolling.ForEach
is a method that takes two parameters, aClosedRange<Int>
and anid
so SwiftUI can identify each of the items uniquely in order to update the values when changed. In this case, 100Text
subviews are created.$0
is a short hand syntax used to reference the first argument in a closure.
This will display the following:
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn SwiftUI on Codecademy
- Skill path
Build iOS Apps with SwiftUI
Learn how to build iOS applications with Swift and SwiftUI and publish them to Apples' App Store.Includes 7 CoursesWith CertificateBeginner Friendly13 hours - Free course
Learn Swift
A powerful programming language developed by Apple for iOS, macOS, and more.Beginner Friendly12 hours