How To Align View In SwiftUI

SwiftUI has changed completely how we build views. There are a few ways to align them related to parents, one of the possible options is usage Spacer view.

Spacer just takes all available space and it allows you to align the rest of the views.

Let’s take Text and move it to the bottom of the screen.

VStack {
    Spacer()
    Text(“Smash Swift!”)
}

Or if you want to move it to the top, then change the order, Text first and Spacer second.

If you need to make it horizontal just change Stack.

HStack {
    Spacer()
    Text(“Smash Swift!”)
}

Maybe you need to split the view, for example, into 4 parts. Just put Spacer between views you want to split.

HStack {
    Image(systemName: “star”)
    Spacer()
    Text(“Smash Swift!”)
    Spacer()
    Text(“SwiftUI”)
    Spacer()
    Image(systemName: “star.fill”)
}