Picker

A generic picker that allows an item to be selected. It is composed of one or more wheels, optionally, with separators between those wheels.

The picker supports arrow key navigation:

  • Up/Down arrows: Increment/decrement selected value
  • Left/Right arrows: Move between wheels

Recommended for touch devices.

Usage

FPicker(...)

const FPicker(
  controller: FPickerController(),
  style: style,
  children: [
    const FPickerWheel(
      flex: 2,
      loop: true,
      itemExtent: 20,
      autofocus: true,
      focusNode: FocusNode(),
      onFocusChange: (focused) {},
      children: [
        Text('1'),
        Text('2'),
      ],
    ),
    const FPickerWheel(
      flex: 2,
      itemExtent: 20,
      autofocus: true,
      focusNode: FocusNode(),
      onFocusChange: (focused) {},
      builder: (context, index) => Text('$1'),
    ),
  ],
);

Examples

Loop

Lazy

Multiple Wheels

With Separators