How to use implicit stacking
Updated for Xcode 13.0
What happens if you create a dynamic list and put more than one thing in each row? SwiftUI’s solution is simple, flexible, and gives us great behavior by default: it creates an implicit HStack to hold your items, so they automatically get laid out horizontally.
As an example, we could create a row where we had a small picture on the left and the remaining space be allocated to a text field, then create an array of three users and show them in a dynamic list.
Here’s how that looks in code:
// An example struct to hold some data
struct User: Identifiable {
let id = UUID()
let username = "Anonymous"
}
// A view to create and show that data in a list
struct ContentView: View {
let users = [User(), User(), User()]
var body: some View {
List(users) { user in
Image("paul-hudson")
.resizable()
.frame(width: 40, height: 40)
Text(user.username)
}
}
}
Download this as an Xcode project
Notice how we don’t need to place the image and text views into a HStack to have them rendered side by side – SwiftUI figures it out for us.
Click here to save 50% on all my books and bundles!
Similar solutions…
