How to create different layouts using size classes

SwiftUI supports size classes natively by exposing them in the environment for us to read. To use them, first create an @Environment object that will store its value, like this:

@Environment(\.horizontalSizeClass) var horizontalSizeClass

Then you check the value of that property whenever you need, looking for either the .compact or .regular size class, like this:

if horizontalSizeClass == .compact {
    return Text("Compact")
} else {
    return Text("Regular")
}

Putting all that together, you might create a view like this:

struct ContentView: View {
    @Environment(\.horizontalSizeClass) var horizontalSizeClass: UserInterfaceSizeClass?

    var body: some View {
        if horizontalSizeClass == .compact {
            return Text("Compact")
        } else {
            return Text("Regular")
        }
    }
}

Size classes are a great way to make your user interfaces intelligently adapt to the available space by using a VStack or a HStack for your content. For example, if you have lots of space you might lay things out horizontally, but switch to vertical layout when space is limited.