How it works
TableHeaderRowContent is the opaque content type that SwiftUI produces for the header row of a Table. Whenever you describe a table's columns with a TableColumnBuilder, the framework collects each column's header label into a single header-row value of this type, which it then renders as the row of titles across the top of the table. You rarely name TableHeaderRowContent yourself; instead you shape it indirectly through the column declarations inside the table's content closure, and you encounter the type in the signatures of the table builders and in result types when working with table structure generically.
Build the header row by declaring columns
The header row is assembled from the columns you list in the table's content closure rather than constructed directly. In
Table(fruits), the twoTableColumndeclarations each contribute one header cell, and SwiftUI gathers those cells into the TableHeaderRowContent that becomes the visible header row.Set each header's title with the column's first argument
The string you pass as a
TableColumnlabel is the text that appears in that column's header cell. HereTableColumn("Name")andTableColumn("Qty")supply the two titles, so the header row produced for the table reads "Name" and "Qty" left to right.Keep header cells aligned with their value cells
Each column owns both a header cell and the per-row value cells generated by its row closure. The
{ fruit in Text(fruit.name) }closure on the Name column governs the body cells beneath the "Name" header, so the header content and the column data stay in one declaration and remain in sync.Order columns to order the header
The sequence of
TableColumnstatements determines the left-to-right order of the header cells. BecauseTableColumn("Name")precedesTableColumn("Qty"), the header row places "Name" before "Qty"; reordering the columns reorders the header without any separate header API.
TableColumn("ID") after the "Qty" column to see a new header cell appended to the right of the existing row.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 TableHeaderRowContentDemo: View {
struct Fruit: Identifiable {
let id = UUID()
let name: String
let count: Int
}
let fruits = [
Fruit(name: "Apple", count: 4),
Fruit(name: "Banana", count: 7),
Fruit(name: "Cherry", count: 12)
]
var body: some View {
Table(fruits) {
TableColumn("Name") { fruit in
Text(fruit.name)
}
TableColumn("Qty") { fruit in
Text("\(fruit.count)")
}
}
.padding()
}
}