Layout

VStack

VStack is a layer that arranges its sublayers in a vertical line.

Overview

Embedding layers in a VStack, or a Vertical Stack, allows you to stack layers in order vertically. A VStack will take up the same amount of space as all of its child layers.

By default, a VStack centers all of its children vertically along the y-axis and sets a spacing of 8 points between each one.

You can horizontally align the content within a VStack to position layers to the following edges:

  • Leading - All layers aligned to the left side of the VStack in a left-to-right language or to the right side in a right-to-left language
  • Center - All layers aligned to the horizontal center of the VStack
  • Trailing - All layers aligned to the right side of the VStack in a left-to-right language or to the right side in a right-to-left language

You can also customize the layout of the layers in your VStack by adjusting its spacing in the Inspector panel.

Pro Tip
With the applicable layer(s) selected, you can use the keyboard shortcut ⌘⇧V to embed them in an VStack.

Resources

Ask Our Community

If you have questions about the Judo editor, or developer questions about SDK integration, join the community and start a conversation!