跳转至
Structure

VStack

A view that arranges children vertically.

Declaration

@frozen struct VStack<Content> : View where Content : View

Overview

VStack is a vertical stack of views. Unlike LazyVStack, which only renders the views when your app needs to display them onscreen, a VStack renders the views all at once, regardless of whether they are on or offscreen. Use the regular VStack when you have a small number of child views or don't want the delayed rendering behavior of the "lazy" version.

struct ExampleView: View {
    var body: some View {
        VStack {
            Text("🍌🍌")
            Text("🍏🍏")
            Text("🍑🍑")
        }
    }
}
A view containing a vertical stack of text views.

Modify your stack's alignment or spacing with the built in initializer.

struct ExampleView: View {
    var body: some View {
        VStack(spacing: 32) {
            Text("🍌🍌")
            Text("🍏🍏")
            Text("🍑🍑")
        }
    }
}
A view containing a vertical stack of text views with spacing between them.

Learn more about the properties of each alignment choice via the HorizontalAlignment struct.

VStack uses a ViewBuilder to construct the content.

Availability

iOS 13.0+

macOS 10.15+

tvOS 13.0+

watchOS 6.0+

Topics


Initializer

init(alignment:spacing:content:) Creates an instance with the given spacing and horizontal alignment.


Type Alias

Body The type of view representing the body of this view.