Tile Group

A tile group that typically groups related information together.

Usage

FTileGroup(...)

FTileGroup(
  controller: ScrollController(),
  cacheExtent: 100,
  maxHeight: 200,
  dragStartBehavior: DragStartBehavior.start,
  label: const Text('Settings'),
  description: const Text('Personalize your experience'),
  semanticLabel: 'Settings',
  divider: FTileDivider.indented,
  children: [],
);

FTileGroup.builder(...)

FTileGroup.builder(
  controller: ScrollController(),
  cacheExtent: 100,
  maxHeight: 200,
  dragStartBehavior: DragStartBehavior.start,
  label: const Text('Settings'),
  description: const Text('Personalize your experience'),
  semanticLabel: 'Settings',
  divider: FTileDivider.indented,
  tileBuilder: (context, index) => FTile(title: Text('Tile $index')),
  predicate: (context, index) => index < 10,
  count: 100,
);

FTileGroup.merge(...)

FTileGroup.merge(
controller: ScrollController(),
  cacheExtent: 100,
  maxHeight: 200,
  dragStartBehavior: DragStartBehavior.start,
  label: const Text('Settings'),
  semanticLabel: 'Settings',
  divider: FTileDivider.indented,
  children: [],
);

Examples

Behavior

Scrollable

Lazy Scrollable

Merge Multiple Groups

This function merges multiple FTileGroupMixins into a single group. It is useful for representing a group with several sections.

⚠️

Deeply nesting FTileGroupMixins is not supported.

Appearance

Full Divider

No Divider