Primitive
ZStack
Layered grid container (CSS grid-template-areas: layer). Children overlap in Z order. Used for overlays and badges (sm-qr anchors via ZStack).
Responsive Preview — viewport @media queries
Mobile · 375 px
Tablet · 768 px
Desktop · 1280 px
Container Tier (SM widget responsive system)
Container width
Live Preview (chrome-mode, container-tier knobs)
Overlay
DSL usage
ZStack {
Rectangle().fill(.gray.opacity(0.06))
Text("Overlay")
}
Attributes
| Name | Type | Default | Description |
|---|---|---|---|
alignment | Alignment | center | Z-layer alignment |