This article has been archived, as it was published several years ago, so some of its information might now be outdated. For more recent articles, please visit the main article feed.
Stacking views in SwiftUI
Discover page available: SwiftUISwiftUI ships with 3 main stack types — that enable you to easily align content on either the X, Y, or Z axis. And, since all SwiftUI views are composable, they can also be nested in order to build really complex UIs:
The above will result in a view which content looks like this:
struct MyView: View {
var body: some View {
// A ZStack stacks its child views on top of each other
// in terms of depth, from back to front.
ZStack {
Color.gray
// A VStack stacks its child views vertically, from
// top to bottom.
VStack {
// The ForEach construct enables you to create
// multiple views in one go, for example by
// mapping a collection of elements to views.
ForEach(0..<5) { _ in
// A HStack aligns its child views horizontally,
// from the leading to the trailing edge.
HStack {
Text("Leading")
Text("Trailing")
}
}
}
}
}
}

Swift by Sundell is brought to you by the Genius Scan SDK — Add a powerful document scanner to any mobile app, and turn scans into high-quality PDFs with one line of code. Try it today.