How it works
A TableRow represents a single row of data inside a Table, pairing one element of your model with the columns that display it. When you build a table from a collection, SwiftUI synthesizes a TableRow for every element automatically; you reach for TableRow explicitly when you need to compose a table's rows by hand — interleaving groups, static rows, or rows from several sources — instead of handing Table a single uniform collection. It is the row-level building block that makes a Table value-driven, so each TableColumn knows which element to read from.
Give each row an Identifiable element
A
TableRowis parameterized by one row value, and that value must beIdentifiableso the table can track, diff, and select rows. In the example eachFruitconforms toIdentifiablevia itsid = UUID(), which is exactly the identity aTableRowcarries for a single fruit.Let Table synthesize rows from a collection
When you initialize
Tablewith a collection, SwiftUI wraps each element in aTableRowfor you, so you never writeTableRowby name. PassingfruitstoTable(fruits)produces one implicitTableRowperFruitelement, which is the most common way to populate a table.Bind columns to the row's element with TableColumn
Each
TableColumnextracts a value from the row's element through a key path, and that element is precisely the value aTableRowholds.TableColumn("Name", value: \.name)andTableColumn("Color", value: \.color)read thenameandcolorproperties from each row'sFruit.Compose rows explicitly when content is non-uniform
To build rows from more than a single collection — mixing sections, fixed rows, or multiple data sources — you place
TableRowvalues directly in the table's row builder instead of passing one collection. The collection-basedTable(fruits)form here is the shorthand; spelling outTableRow(fruit)for each element is the equivalent explicit form.
Table(fruits) with an explicit row builder, e.g. Table(of: Fruit.self) { ... } rows: { ForEach(fruits) { TableRow($0) } }, to see the same rows produced by named TableRow values.Example & preview
Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.
struct TableRowDemo: View {
struct Fruit: Identifiable {
let id = UUID()
let name: String
let color: String
}
let fruits = [
Fruit(name: "Apple", color: "Red"),
Fruit(name: "Banana", color: "Yellow"),
Fruit(name: "Grape", color: "Purple")
]
var body: some View {
Table(fruits) {
TableColumn("Name", value: \.name)
TableColumn("Color", value: \.color)
}
.padding()
}
}