Skip to Content
Forui 0.13.0 is released 🎉
DocumentationData PresentationItem Group

Item Group

An item group that typically groups related information together.

This widget is typically used to create more complex widgets rather than being used directly.

API Reference

CLI

To generate and customize this style:

dart run forui style create item-group

Usage

FItemGroup(...)

FItemGroup(
  scrollController: ScrollController(),
  style: FItemGroupStyle(...),
  cacheExtent: 100,
  maxHeight: 200,
  dragStartBehavior: DragStartBehavior.start,
  physics: const ClampingScrollPhysics(),
  semanticsLabel: 'Settings',
  divider: FItemDivider.indented,
  children: [
    FItem(title: const Text('Item'),
  ],
);

FItemGroup.builder(...)

FItemGroup.builder(
  scrollController: ScrollController(),
  style: FItemGroupStyle(...),
  cacheExtent: 100,
  maxHeight: 200,
  dragStartBehavior: DragStartBehavior.start,
  physics: const ClampingScrollPhysics(),
  semanticsLabel: 'Settings',
  divider: FItemDivider.indented,
  itemBuilder: (context, index) => index < 10 ? FItem(title: Text('Item $index')) : null,
  count: 100,
);

FItemGroup.merge(...)

FItemGroup.merge(
  scrollController: ScrollController(),
  cacheExtent: 100,
  maxHeight: 200,
  dragStartBehavior: DragStartBehavior.start,
  physics: const ClampingScrollPhysics(),
  semanticsLabel: 'Settings',
  divider: FItemDivider.indented,
  children: [
    FItemGroup(
      children: [],
    )
  ],
);

Examples

Behavior

Scrollable

Lazy Scrollable

Merge Multiple Groups

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

Appearance

Full Divider

Indented Divider

Last updated on
ItemLine Calendar