Articles, podcasts and news about Swift development, by John Sundell.

Stacking views in SwiftUI

Published on 06 Jun 2019
Discover page available: SwiftUI

SwiftUI 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")
                    }
                }
            }
        }
    }
}

Support Swift by Sundell by checking out this sponsor:

Genius Scan SDK

Genius Scan SDK: Add a powerful document scanner to any iOS app. Genius Scan’s SDK features advanced image processing that’s the result of over 10 years of research and development and can be fully customized and integrated into your app with just one line of code. Mention Swift by Sundell when requesting a free demo to get a 20% discount on your license for a whole year.