Select Menu Tile
A tile that, when triggered, displays a list of options for the user to pick from.
For desktop, a select group is generally recommended over this.
Preview
Usage
FSelectMenuTile(...)
FSelectMenuTile<Value>(
selectController: FSelectMenuTileController(), // or FSelectMenuTileController.radio()
menuAnchor: Alignment.topRight,
tileAnchor: Alignment.bottomRight,
spacing: const FPortalSpacing(4),
shift: FPortalShift.flip,
offset: Offset.zero,
hideOnTapOutside: FHidePopoverRegion.anywhere,
autoHide: false,
scrollController: ScrollController(),
cacheExtent: 100,
maxHeight: 200,
dragStartBehavior: DragStartBehavior.start,
physics: const ClampingScrollPhysics(),
divider: FTileDivider.indented,
label: const Text('Sidebar'),
description: const Text('Select the items you want to display in the sidebar.'),
errorBuilder: (context, error) => Text(error),
prefixIcon: Icon(FIcons.bell),
title: Text('Notifications'),
subtitle: Text('subtitle'),
details: Text('All'),
suffixIcon: Icon(FIcons.chevronsUpDown),
onChange: (all) => print(all),
onSelect: (selection) => print(selection),
menu: [
FSelectTile(
title: const Text('1'),
value: Value.something,
),
],
);
FSelectMenuTile.builder(...)
FSelectMenuTile<Value>.builder(
selectController: FSelectMenuTileController(), // or FSelectMenuTileController.radio()
menuAnchor: Alignment.topRight,
tileAnchor: Alignment.bottomRight,
spacing: const FPortalSpacing(4),
shift: FPortalShift.flip,
offset: Offset.zero,
hideOnTapOutside: FHidePopoverRegion.anywhere,
autoHide: false,
scrollController: ScrollController(),
cacheExtent: 100,
maxHeight: 200,
dragStartBehavior: DragStartBehavior.start,
physics: const ClampingScrollPhysics(),
divider: FTileDivider.indented,
label: const Text('Sidebar'),
description: const Text('Select the items you want to display in the sidebar.'),
errorBuilder: (context, error) => Text(error),
prefixIcon: Icon(FIcons.bell),
title: Text('Notifications'),
subtitle: Text('subtitle'),
details: Text('All'),
suffixIcon: Icon(FIcons.chevronsUpDown),
menuBuilder: (context, index) => index < 10 ? FSelectTile(
title: Text('Tile $index'),
value: Value.something,
) : null,
count: 100,
onChange: (all) => print(all),
onSelect: (selection) => print(selection),
);
Examples
Auto Hide
Preview
Scrollable
Preview
Lazy Scrollable
Preview
Form
Preview
Last updated on