FItem constructor

FItem({
  1. required Widget title,
  2. FItemStyle style(
    1. FItemStyle
    )?,
  3. bool? enabled,
  4. bool selected = false,
  5. String? semanticsLabel,
  6. bool autofocus = false,
  7. FocusNode? focusNode,
  8. ValueChanged<bool>? onFocusChange,
  9. ValueChanged<bool>? onHoverChange,
  10. ValueChanged<FWidgetStatesDelta>? onStateChange,
  11. VoidCallback? onPress,
  12. VoidCallback? onLongPress,
  13. VoidCallback? onSecondaryPress,
  14. VoidCallback? onSecondaryLongPress,
  15. Map<ShortcutActivator, Intent>? shortcuts,
  16. Map<Type, Action<Intent>>? actions,
  17. Widget? prefix,
  18. Widget? subtitle,
  19. Widget? details,
  20. Widget? suffix,
  21. Key? key,
})

Creates a FItem.

Assuming LTR locale:

-----------------------------------------------------
| [prefix] [title]       [details] [suffix]         |
|          [subtitle]                               |
-----------------------------------------------------

The order is reversed for RTL locales.

Overflow behavior

FItem has custom layout behavior to handle overflow of its content. If details is text, it is truncated, else title and subtitle are truncated.

Why isn't my title subtitle, or details rendered?

Using widgets that try to fill the available space, such as Expanded or FTextField, as details will cause the title and subtitle to never be rendered.

Use FItem.raw in these cases.

Implementation

FItem({
  required Widget title,
  this.style,
  this.enabled,
  this.selected = false,
  this.semanticsLabel,
  this.autofocus = false,
  this.focusNode,
  this.onFocusChange,
  this.onHoverChange,
  this.onStateChange,
  this.onPress,
  this.onLongPress,
  this.onSecondaryPress,
  this.onSecondaryLongPress,
  this.shortcuts,
  this.actions,
  Widget? prefix,
  Widget? subtitle,
  Widget? details,
  Widget? suffix,
  super.key,
}) : _builder = ((context, style, top, bottom, states, color, width, divider) => ItemContent(
       style: style.contentStyle,
       margin: style.margin,
       top: top,
       bottom: bottom,
       states: states,
       dividerColor: color,
       dividerWidth: width,
       dividerType: divider,
       prefix: prefix,
       title: title,
       subtitle: subtitle,
       details: details,
       suffix: suffix,
     ));