Item

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

FItem(
  enabled: true,
  prefix: const Icon(FIcons.user),
  title: const Text('Personalization'),
  suffix: const Icon(FIcons.chevronRight),
  onPress: () {},
);

CLI

To generate and customize this style:

dart run forui style create item

Usage

`FItem(...)`

FItem(
  title: const Text('Title'),
  style: (style) => style.copyWith(...),
  enabled: true,
  selected: false,
  semanticsLabel: 'Label',
  autofocus: false,
  focusNode: FocusNode(),
  onFocusChange: (focused) {},
  onHoverChange: (hovered) {},
  onStateChange: (delta) {},
  onPress: () {},
  onLongPress: () {},
  onSecondaryPress: () {},
  onSecondaryLongPress: () {},
  shortcuts: {SingleActivator(LogicalKeyboardKey.enter): ActivateIntent()},
  actions: {ActivateIntent: CallbackAction<ActivateIntent>(onInvoke: (_) {})},
  prefix: Icon(FIcons.user),
  subtitle: const Text('Subtitle'),
  details: const Text('Details'),
  suffix: Icon(FIcons.chevronRight),
);

`FItem.raw(...)`

FItem.raw(
  child: const Text('Title'),
  style: (style) => style.copyWith(...),
  enabled: true,
  selected: false,
  semanticsLabel: 'Label',
  autofocus: false,
  focusNode: FocusNode(),
  onFocusChange: (focused) {},
  onHoverChange: (hovered) {},
  onStateChange: (delta) {},
  onPress: () {},
  onLongPress: () {},
  onSecondaryPress: () {},
  onSecondaryLongPress: () {},
  shortcuts: {SingleActivator(LogicalKeyboardKey.enter): ActivateIntent()},
  actions: {ActivateIntent: CallbackAction<ActivateIntent>(onInvoke: (_) {})},
  prefix: Icon(FIcons.user),
);

Examples

Untappable

FItem(
  enabled: true,
  prefix: const Icon(FIcons.user),
  title: const Text('Personalization'),
  suffix: const Icon(FIcons.chevronRight),
);

Disabled

FItem(
  enabled: false,
  prefix: const Icon(FIcons.user),
  title: const Text('Personalization'),
  suffix: const Icon(FIcons.chevronRight),
  onPress: () {},
);

With Subtitle

FItem(
  prefix: const Icon(FIcons.bell),
  title: const Text('Notifications'),
  subtitle: const Text('Banners, Sounds, Badges'),
  suffix: const Icon(FIcons.chevronRight),
  onPress: () {},
);

With Details

FItem(
  prefix: const Icon(FIcons.wifi),
  title: const Text('WiFi'),
  details: const Text('Duobase (5G)'),
  suffix: const Icon(FIcons.chevronRight),
  onPress: () {},
);

On this page