HStack

Declaration

@frozen struct HStack<Content> where Content : View

Mentioned in

• Building layouts with stack views
• Creating performant scrollable stacks
• Laying out a simple view
• Aligning views across stacks
• Aligning views within a stack
• Picking container views for your content
• Applying Liquid Glass to custom views

Overview

Unlike LazyHStack, which only renders the views when your app needs to display them onscreen, an HStack renders the views all at once, regardless of whether they are on- or offscreen. Use the regular HStack when you have a small number of subviews or don’t want the delayed rendering behavior of the “lazy” version.

The following example shows a simple horizontal stack of five text views:

var body: some View {
    HStack(
        alignment: .top,
        spacing: 10
    ) {
        ForEach(
            1...5,
            id: \.self
        ) {
            Text("Item \($0)")
        }
    }
}

[Image]

Topics

Creating a stack

• init(alignment:spacing:content:)

Relationships

Conforms To

• View

See Also

Statically arranging views in one dimension

• Building layouts with stack views
• VStack