Skip to main content
.listStyle(style: "automatic" | "plain" | "insetGrouped" | "grouped" | "inset" | "sidebar"): Component
​
style
string
required
The list style to apply:
  • "automatic" — the platform default style
  • "plain" — a plain list with no section styling
  • "insetGrouped" — grouped sections with inset rounded corners (default on iOS)
  • "grouped" — grouped sections with full-width backgrounds
  • "inset" — plain list with inset margins
  • "sidebar" — optimized for sidebar navigation

​
Support

​
Usage

​
Plain list

List([
    ForEach(items, (item) =>
        Text(item.name)
    )
]).listStyle("plain")

​
Grouped list with sections

List([
    Section("Fruits", [
        Text("Apple"),
        Text("Banana"),
        Text("Cherry")
    ]),
    Section("Vegetables", [
        Text("Carrot"),
        Text("Broccoli")
    ])
]).listStyle("insetGrouped")

List([
    ForEach(menuItems, (item) =>
        Label(item.title, item.icon)
    )
]).listStyle("sidebar")

​
See Also