Embedding layers in a ZStack (z because the layers are defined by their z-index), allows you to position layers on top of each other. A ZStack defaults to center alignment vertically and horizontally.
The ZStack assigns each new layer inside of it a higher z-axis value than the previous one, so the most recent ones will appear “on top” of the lower-rung layers and they all inherit the alignment set on the ZStack.
A ZStack can be aligned horizontally and/or vertically:
Top Leading - Layers aligned to the Leading top corner of the largest layer in the ZStack
Top - Layers aligned to the top center of the largest layer in the ZStack
Top Trailing - Layers aligned to the Trailing top corner of the largest layer in the ZStack
Leading - Layers aligned in the center but to the Leading edge of the largest layer
Center - Layers aligned in the center, vertically and horizontally of the largest layer
Trailing - Layers aligned in the center but to the Trailing edge of the largest layer
Bottom Leading - Layers aligned to the bottom Leading corner of the largest layer in the ZStack
Bottom - Layers aligned at the bottom center of the largest layer in the ZStack
Bottom Trailing - Layers aligned to the bottom Trailing corner of the largest layer in the ZStack
Leading Text Baseline - Layers aligned to the Leading edge of the largest layer and to the baseline of its largest Text layer
Text Baseline - Layers aligned in the center of the largest layer but at the baseline of its largest Text layer
Trailing Text Baseline - Layers aligned to the Trailing edge of the largest layer and to the baseline of its largest Text layer
