Skip to content

Spec: VStack

Matt Carroll edited this page Mar 11, 2024 · 3 revisions

"A view that arranges its subviews in a vertical line."

https://developer.apple.com/documentation/swiftui/vstack/

Layout

TODO:

Typography

TODO:

Accessibility

TODO:

Localization

TODO:

Technical Design

/// A layout widget that displays its children vertically, like a column.
///
/// A `VStack` tightly wraps its [children]. Each child must have an intrinsic height
/// to be visible in a `VStack`.
class VStack extends StatelessWidget {
    const VStack(this.children, {
      this.alignment = HorizontalAlignment.center,
      this.spacing,
    });

    /// The horizontal (cross-axis) alignment of the [children] within this [VStack].
    ///
    /// See [HorizontalAlignment] for more info about the available alignments.
    final HorizontalAlignment alignment;
    
    /// The vertical spacing between each of the [children] in this [VStack].
    final double? spacing;
    
    /// Child widgets, which are displayed vertically in a column-style layout.
    final List<Widget> children;
}

enum HorizontalAlignment {
    /// Alignment with the "leading" or "starting" edge of a bounding space.
    ///
    /// In a left-to-right layout context, the leading edge is the left edge.
    leading,
    
    /// Alignment that's equidistant from the left and right edges of a bounding space.
    center,
    
    /// Alignment with the "trailing" or "ending" edge of a bounding space.
    ///
    /// In a left-to-right layout context, the trailing edge is the right edge.
    trailing,
    
    /// Alignment with the leading edge of a list separator - this alignment is only
    /// relevant when a widget is displayed within a list that has dividers.
    listRowSeparatorLeading,
    
    /// Alignment with the trailing edge of a list separator - this alignment is only
    /// relevant when a widget is displayed within a list that has dividers.
    listRowSeparatorTrailing,
}
Clone this wiki locally