advanced_dropdown 2.0.7
advanced_dropdown: ^2.0.7 copied to clipboard
A customizable Flutter dropdown with search, single-select, and multi-select support.
πΈ Screenshots #
| Custom Decoration | Single Select | Single Select with Search | Multi Select | Multi Select with Search |
|---|---|---|---|---|
![]() |
![]() |
![]() |
![]() |
![]() |
π§© Custom Dropdown for Flutter #
A fully customizable dropdown widget for Flutter that supports single-select, multi-select, and search β all in one widget.
Lightweight, flexible, and easy to integrate into any Flutter project.
π± Platform Support #
| Platform | Supported | Tested |
|---|---|---|
| Android | β | β |
| iOS | β | β |
| Web | β | β |
| Windows | β | βοΈ |
| macOS | β | βοΈ |
| Linux | β | βοΈ |
π‘ Works with Flutter 3.0+ and Dart 3.0+
β¨ Features #
β
Single Select (default) β behaves like a normal dropdown
β
Multi Select β users can select multiple items
β
Searchable Dropdown β optional search bar for filtering
β
Flexible Decoration β customize dropdown and list appearance
β
Custom InputDecoration for search bar
β
Auto position below the button
β
Lightweight (~3 KB compressed)
β
No external dependencies
β
Custom Dropdown Button Design
β
Custom Dropdown Icon
βοΈ Customization Options #
Below is a complete list of customizable properties available in the AdvancedDropdown widget.
| Property | Type | Required | Default | Description |
|---|---|---|---|---|
| items | List<dynamic> List<Map<String, dynamic>> |
β Yes | β | The list of items to show in the dropdown. Supports List<String> and complex maps (via labelBuilder / valueBuilder). |
| onChanged | Function(dynamic) |
β Yes | β | Callback when selection changes. Returns a single value in single-select mode, or a list of values in multi-select mode. |
| isSearch | bool |
β No | false |
Enables an inline search field for filtering dropdown items. |
| isMultiSelect | bool |
β No | false |
Enables multiple selection with checkboxes and removable chips. |
| labelBuilder | String Function(dynamic)? |
β No | null |
Extracts a display label from each item. Example: (item) => item['label']. |
| valueBuilder | dynamic Function(dynamic)? |
β No | null |
Extracts the itemβs actual selectable value. Example: (item) => item['value']. |
| initialValue | dynamic |
β No | null |
Sets the initial selected value for single-select dropdowns. |
| initialValues | List<dynamic>? |
β No | null |
Sets initial selected values for multi-select dropdowns. |
| maxSelection | int? |
β No | null |
If set, limits how many items can be selected in multi-select mode. Shows a SnackBar if exceeded. |
| decoration | BoxDecoration? |
β No | null |
Styles the main dropdown button (background, border, radius, shadow). |
| dropdownDecoration | BoxDecoration? |
β No | null |
Styles the popup dropdown container (background, border, radius). |
| inputDecoration | InputDecoration? |
β No | null |
Customizes the search box appearance. |
| icon | Icon? |
β No | Icon(Icons.arrow_drop_down) |
Icon displayed on the right side of the dropdown. |
| hintText | String? |
β No | "Select item" |
Text to display when no item is selected (single or multi). |
| hintStyle | TextStyle? |
β No | null |
Styling for the hint text. |
| itemTextStyle | TextStyle? |
β No | null |
Style applied to items inside the dropdown popup list. |
| selectedTextStyle | TextStyle? |
β No | null |
Style for the selected item when using single-select. |
| chipColor | Color |
β No | Color(0xFFD0E6FF) |
Background color of chips in multi-select mode. |
| chipTextColor | Color |
β No | Colors.black |
Default chip label text color. |
| chipTextStyle | TextStyle? |
β No | null |
Custom chip text appearance (font, size, weight, etc.). |
| chipRemoveIconColor | Color |
β No | Colors.black54 |
Color of the "remove" (Γ) icon on chips. |
| padding | EdgeInsets |
β No | const EdgeInsets.symmetric(horizontal: 12, vertical: 10) |
Controls internal padding of the main dropdown field. |
| key | Key? |
β No | null |
Standard Flutter Key for widget identity. |
π‘ Notes #
- Use labelBuilder and valueBuilder for complex data structures (List<Map<String, dynamic>>).
- initialValue and initialValues are perfect for restoring selections when reloading saved data.
- You can mix and match text styles (hintStyle, itemTextStyle, chipTextStyle) for full design flexibility.
- Default mode = Single Select
- When
isMultiSelect: true, theonChangedcallback returns a List of selected items. - Dropdown automatically opens below the button.
- The dropdown closes automatically when clicking outside its overlay area.
- You can style everything (dropdown, button, list, search bar).
- Works seamlessly with light and dark themes.




