Combobox<T> class

A material design button for selecting from a list of items.

A combobox button lets the user select from a number of items. The button shows the currently selected item as well as an arrow that opens a menu for selecting another item.

The type T is the type of the value that each combobox item represents. All the entries in a given menu must represent values with consistent types. Typically, an enum is used. Each ComboboxItem in items must be specialized with that same type argument.

The onChanged callback should update a state variable that defines the combobox's value. It should also call State.setState to rebuild the combobox with the new value.

{@tool dartpad --template=stateful_widget_scaffold_center}

This sample shows a Combobox with a large arrow icon, purple text style, and bold purple underline, whose value is one of "One", "Two", "Free", or "Four".

String comboboxValue = 'One';

@override
Widget build(BuildContext context) {
  return Combobox<String>(
    value: comboboxValue,
    icon: Icon(Icons.arrow_downward),
    iconSize: 24,
    elevation: 16,
    style: TextStyle(
      color: Colors.deepPurple
    ),
    onChanged: (String? newValue) {
      setState(() {
        comboboxValue = newValue!;
      });
    },
    items: <String>['One', 'Two', 'Free', 'Four']
      .map<ComboboxItem<String>>((String value) {
        return ComboboxItem<String>(
          value: value,
          child: Text(value),
        );
      })
      .toList(),
  );
}

{@end-tool}

If the onChanged callback is null or the list of items is null then the combobox button will be disabled, i.e. its arrow will be displayed in grey and it will not respond to input. A disabled button will display the disabledHint widget if it is non-null. However, if disabledHint is null and placeholder is non-null, the placeholder widget will instead be displayed.

Requires one of its ancestors to be a Material widget.

See also:

• ComboboxItem, the class used to represent the items.
• ElevatedButton, TextButton, ordinary buttons that trigger a single action.
• material.io/design/components/menus.html#combobox-menu