dropdown_pro 1.2.0 icon indicating copy to clipboard operation
dropdown_pro: ^1.2.0 copied to clipboard

Single or Multi Selection Dropdown with search dropdown item, and easy to customization.

dropdown_pro #

Single or Multi Selection Dropdown with search dropdown item, and easy to customization.

Using #

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile and web development, and a full API reference.

Installation #

First, add dropdown_pro as a dependency in your pubspec.yaml file.

In your flutter project add the dependency:

dependencies:
  ...
  dropdown_pro:

For help getting started with Flutter, view the online documentation.

Example #

Please follow this example here.

  1. Declare variables
List<DropdownItem> _itemList = [];
String _singleSelectedId = ""; //for single selection dropdown
final List<String> _mutiSelectedIds = []; //for multi selection dropdown
  1. Generate your item list
_generateItems() {
  List<DropdownItem> list = [];
  for (int i = 1; i <= 20; i++) {
    list.add(DropdownItem(
        id: "$i",
        value: "Item $i",
        data: User(userId: "$i", userName: "User $i") /* User class is another data class (use any datatype in data field )*/
    ));
  }
  setState(() {
    _itemList = list;
  });
}
  1. Put Dropdown in your build function
  • Single Selection Dropdown
Dropdown.singleSelection(
  title: "Single Selection Dropdown",
  labelText: "Single",
  hintText: "Single Selection",
  list: _itemList,
  selectedId: _singleSelectedId,
  onSingleItemListener: (selectedItem) {
    setState(() {
      _singleSelectedId = selectedItem.id;
    });
    String itemId = selectedItem.id;
    String itemName = selectedItem.value;
    User user = selectedItem.data as User;
    log("Item Id: $itemId -- Item Name: $itemName ## Other Details ## User Id: ${user.userId} -- User Name: ${user.userName}");
})
  • Multi Selection Dropdown
Dropdown.multiSelection(
  title: "Multi Selection Dropdown",
  labelText: "Multi",
  hintText: "Multi Selection",
  list: _itemList,
  selectedIds: _mutiSelectedIds,
  allSelection: true,
  onMultipleItemListener: (selectedItemList) {
    for (DropdownItem selectedItem in selectedItemList) {
      String itemId = selectedItem.id;
      String itemName = selectedItem.value;
      User user = selectedItem.data as User;
      log("Item Id: $itemId -- Item Name: $itemName ## Other Details ## User Id: ${user.userId} -- User Name: ${user.userName}");
    }
})
3
likes
130
pub points
71%
popularity

Publisher

unverified uploader

Single or Multi Selection Dropdown with search dropdown item, and easy to customization.

Repository (GitHub)
View/report issues

Documentation

API reference

License

Icon for licenses.BSD-3-Clause (LICENSE)

Dependencies

flutter, flutter_web_plugins

More

Packages that depend on dropdown_pro