Skip to main content

Theming

Grid appearance can be set at the FDC application/theme level and refined on individual grids and components.

Shared theme​

FdcApp(
  theme: const FdcThemeData(
    grid: FdcGridThemes.white,
    editor: FdcEditorThemes.white,
  ),
  child: app,
)

Per-grid override​

FdcGrid(
  dataSet: customers,
  theme: FdcGridThemes.white,
  style: const FdcGridStyle(),
)

Component-level styling​

Header, toolbar, summary, status bar, cell indicator, column groups, and individual columns expose focused style/configuration objects. Prefer shared theme settings for application-wide appearance and local styles for deliberate exceptions.

Formatting​

Grid cells, inline editors, header filters, and toolbar search share the FDC formatting contract. Use app-level format settings for a common locale or override them per grid when one screen needs different presentation rules.

FdcGrid(
  dataSet: customers,
  formatSettings: const FdcFormatSettings(
    locale: 'en_US',
    dateFormat: 'MM/dd/yyyy',
    timeFormat: 'h:mm a',
    dateTimeFormat: 'MM/dd/yyyy h:mm a',
    decimalSeparator: '.',
    thousandSeparator: ',',
  ),
)