Dropdown

Dropdowns for choosing one or multiple values from a list. [PrimeDropdown] is single-select; [PrimeMultiDropdown] allows multiple selections. Styled to match other Prime form controls.

Basic

PrimeDropdown<String>(
  value: selected,
  placeholder: 'Select a fruit',
  items: ['Apple', 'Banana', 'Orange', 'Mango', 'Grape'],
  onChanged: (v) => setState(() => selected = v),
)

Custom labels

Use itemBuilder to control how each option is displayed. The selected value is unchanged; only the label is custom.

PrimeDropdown<String>(
  value: selected,
  placeholder: 'Choose one',
  items: options,
  itemBuilder: (s) => Text(s.toUpperCase()),
  onChanged: (v) => setState(() => selected = v),
)

Multiselect

Choose multiple values. Tap options to toggle; tap outside to close.

PrimeMultiDropdown<String>(
  value: selected,
  placeholder: 'Select fruits',
  items: ['Apple', 'Banana', 'Orange', 'Mango', 'Grape'],
  onChanged: (v) => setState(() => selected = v),
)

Near bottom of screen

When there isn’t enough space below, the menu opens above the trigger. This preview has the dropdown at the bottom so you can see it open upward.

// Same PrimeDropdown — when placed near the bottom it opens upward
PrimeDropdown<String>(
  value: selected,
  placeholder: 'Select a fruit',
  items: ['Apple', 'Banana', 'Orange', 'Mango', 'Grape'],
  onChanged: (v) => setState(() => selected = v),
)

Disabled

PrimeDropdown<String>(
  value: 'Apple',
  placeholder: 'Disabled',
  items: options,
  onChanged: null,
  disabled: true,
)