all_in_one_dropdown 0.0.4 copy "all_in_one_dropdown: ^0.0.4" to clipboard
all_in_one_dropdown: ^0.0.4 copied to clipboard

A customizable Flutter package that supports single dropdown, searchable dropdown, and multi-select dropdown in one unified widget.

all_in_one_dropdown #

A powerful and customizable Flutter package for creating dropdowns with multiple modes:
🔹 Normal dropdown
🔹 Searchable dropdown
🔹 Multi-select dropdown

This package is designed to be reusable and flexible, making dropdown integration seamless for any Flutter project.


✨ Features #

  • ✅ Normal dropdown
  • 🔍 Searchable dropdown
  • ✅ Multi-select dropdown
  • 🎨 Highly customizable appearance
  • 📱 Responsive design with smooth keyboard handling
  • ⚡ Easy integration and reusable components

Platform Support #

Android iOS MacOS Web Linux Windows

Requirements #

  • Flutter >=3.18.0-18.0.pre.54
  • Dart >=3.8.0 <4.0.0
  • iOS >=12.0
  • MacOS >=10.14
  • Android compileSDK 34
  • Java 17
  • Android Gradle Plugin >=8.7.3
  • Gradle wrapper >=8.12

📸 Screenshot #


Normal Dropdown

Searchable Dropdown

Multi-Select Dropdown

🚀 Installation #

Add the following line to your pubspec.yaml:

dependencies:
  all_in_one_dropdown: ^1.0.0

Import library in your file #

import 'package:all_in_one_dropdown/all_in_one_dropdown.dart';

Create below variables #

final selectedItems = DropDownDataModel();
final items = <DropDownDataModel>[
  DropDownDataModel(id: '1', title: 'Apple'),
  DropDownDataModel(id: '2', title: 'Banana'),
  DropDownDataModel(id: '3', title: 'Cherry'),
  DropDownDataModel(id: '4', title: 'Watermelon fruit'),
  DropDownDataModel(id: '5', title: 'Grapes'),
  DropDownDataModel(id: '6', title: 'Guava'),
  DropDownDataModel(id: '7', title: 'Orange'),
  DropDownDataModel(id: '8', title: 'Strawberry'),
  DropDownDataModel(id: '9', title: 'Coconut'),
  DropDownDataModel(id: '10', title: 'Pineapple'),
];

This is how we can used #

Container(
  child: CustomDropdown(
    items: items,
    selectedItem: selectedItems.id == null ? null : selectedItems,
    hintText: 'Choose a fruit',
    isSearch: true, // Enable or disable search field
    onChanged: (value) {
      selectedItems.id = value.id;
      selectedItems.title = value.title;
    },
    buttonBackgroundColor: Color(0xFF171717),
    borderColor: Color(0xFF292929),
    dropdownIconColor: Colors.white,
    hintTextColor: Color(0xFF707070),
    dropdownBackgroundColor: Color(0xFF171717),
    dropdownTextColor: Colors.white,
    searchBackgroundColor: Color(0xFF252525),
    searchTextColor: Colors.white,
    searchIconColor: Colors.white,
    textColor: Colors.white,
  ),
),

Here is full example #

class ExampleDropdownScreen extends StatelessWidget {
  final selectedItems = DropDownDataModel();
  final items = <DropDownDataModel>[
    DropDownDataModel(id: '1', title: 'Apple'),
    DropDownDataModel(id: '2', title: 'Banana'),
    DropDownDataModel(id: '3', title: 'Cherry'),
    DropDownDataModel(id: '4', title: 'Watermelon fruit'),
    DropDownDataModel(id: '5', title: 'Grapes'),
    DropDownDataModel(id: '6', title: 'Guava'),
    DropDownDataModel(id: '7', title: 'Orange'),
    DropDownDataModel(id: '8', title: 'Strawberry'),
    DropDownDataModel(id: '9', title: 'Coconut'),
    DropDownDataModel(id: '10', title: 'Pineapple'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: Center(
        child: CustomDropdown(
          items: items,
          selectedItem: selectedItems.id == null ? null : selectedItems,
          hintText: 'Choose a fruit',
          isSearch: true,
          onChanged: (value) {
            selectedItems.id = value.id;
            selectedItems.title = value.title;
          },
          buttonBackgroundColor: Color(0xFF171717),
          borderColor: Color(0xFF292929),
          dropdownIconColor: Colors.white,
          hintTextColor: Color(0xFF707070),
          dropdownBackgroundColor: Color(0xFF171717),
          dropdownTextColor: Colors.white,
          searchBackgroundColor: Color(0xFF252525),
          searchTextColor: Colors.white,
          searchIconColor: Colors.white,
          textColor: Colors.white,
        ),
      ),
    );
  }
}

LICENSE! #

drop_down_list is MIT-licensed.

6
likes
160
points
17
downloads

Publisher

unverified uploader

Weekly Downloads

A customizable Flutter package that supports single dropdown, searchable dropdown, and multi-select dropdown in one unified widget.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on all_in_one_dropdown