How it works
TableStyle is the protocol that defines the appearance and layout of a Table — its row insets, grid lines, header treatment, and column dividers. Rather than restyling a table's parts by hand, you adopt one of the built-in conforming styles and let SwiftUI render the table consistently across platforms. Reach for TableStyle whenever a Table's default look doesn't match its context — for example, when you want an inset list-like presentation instead of the full grid chrome.
Apply a style with tableStyle(_:)
TableStyle takes effect through the tableStyle(_:) modifier, which sets the style for the Table it's attached to and any tables nested below it. In the example,
.tableStyle(.inset)is chained directly onto theTablevalue, telling that table to render with the inset style.Choose a concrete conforming style
You don't construct a TableStyle yourself; you pass a value of a type that conforms to it. SwiftUI ships several —
.inset,.bordered, and.automaticamong them — each a distinct conformer. The example selects.inset, which pulls the rows in from the edges for a softer, list-style appearance.Style applies to the Table, not its columns
TableStyle governs the table's overall framing and spacing, while the data and headers are still declared with
TableandTableColumn. Here theTable(fruits)body holds twoTableColumndefinitions for "Name" and "Color", and the style decorates that whole structure without changing how the columns bind their values.Fall back to the automatic style
Every TableStyle context resolves to
.automaticwhen you don't specify one, letting the platform pick an idiomatic default. Naming a style like.insetis how you override that default; remove the modifier and the sameTable(fruits)reverts to the automatic presentation.
.tableStyle(.inset) to .tableStyle(.bordered) to see the full grid lines and column dividers return around the same fruit table.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 TableStyleDemo: 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)
}
.tableStyle(.inset)
.padding()
}
}