Skip to main content

Data Grid

FdcGrid is the data-aware grid surface in Flutter Data Components. It binds directly to an FdcDataSet, so navigation, editing, validation, filtering, sorting, searching, and persistence all share the same data state.

FdcGrid(
  dataSet: customers,
  columns: const [
    FdcIntegerColumn<dynamic>(
      fieldName: 'id',
      label: 'ID',
      width: 80,
      readOnly: true,
    ),
    FdcTextColumn<dynamic>(
      fieldName: 'company',
      label: 'Company',
      width: 240,
    ),
    FdcTextColumn<dynamic>(
      fieldName: 'city',
      label: 'City',
      width: 160,
    ),
  ],
)

The grid does not copy dataset records into a second state model. Cell edits write through the dataset edit buffer, row navigation follows dataset lifecycle rules, and adapter-backed operations stay inside the same query flow.

Community and Pro capabilities​

The core grid includes columns, editing, validation feedback, filtering, sorting, search, row selection, summaries, column grouping, pinning, resizing, keyboard navigation, theming, toolbar and status-bar composition.

Pro capabilities appear in the same documentation flow where they belong, including detail rows, range selection, layout persistence, rating columns, and sparkline columns.

Next steps​