Skip to Content
Forui 0.11.0 is released 🎉
DocumentationTileSelect Tile Group

Select Tile Group

A group of tiles that allow users to make a selection from a set of options.

For desktop, a select group is generally recommended over this.

Usage

FSelectTileGroup(...)

FSelectTileGroup<Value>( selectController: FSelectTileGroupController(), // or FSelectTileGroupController.radio() scrollController: ScrollController(), cacheExtent: 100, maxHeight: 200, dragStartBehavior: DragStartBehavior.start, physics: const ClampingScrollPhysics(), label: const Text('Sidebar'), description: const Text('Select the items you want to display in the sidebar.'), divider: FTileDivider.indented, onChange: (all) => print(all), onSelect: (selection) => print(selection), children: [ FSelectTile( title: const Text('1'), value: Value.something, ), ], );

FTileGroup.builder(...)

FSelectTileGroup<Value>.builder( selectController: FSelectTileGroupController(), // or FSelectTileGroupController.radio() scrollController: ScrollController(), cacheExtent: 100, maxHeight: 200, dragStartBehavior: DragStartBehavior.start, physics: const ClampingScrollPhysics(), label: const Text('Settings'), description: const Text('Personalize your experience'), semanticsLabel: 'Settings', divider: FTileDivider.indented, onChange: (all) => print(all), onSelect: (selection) => print(selection), tileBuilder: (context, index) => index < 10 ? FSelectTile( title: Text('Tile $index'), value: Value.something, ) : null, count: 100, );

Examples

Behavior

Scrollable

Lazy Scrollable

Multi-value Form

Radio Form

Appearance

Custom Icons

Full Divider

No Divider

Last updated on