搜尋套件、儲存庫與 APP 分類

套件詳情v2.0.0

extendable_dropdown

ExtendableDropdown 是一個多功能的 Flutter 套件,用於建立動態且可自訂的下拉選單

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
35
喜歡數
2
Pub 分數
155

安裝套件

flutter pub add extendable_dropdown

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

ExtendableDropdown 是一個靈活的 Flutter 套件,可在多個平台建立動態且可自訂的下拉選單。支援單一與多重選擇,讓開發者能輕鬆調整下拉選單的外觀與行為。此套件可無縫整合至 Flutter 應用程式中,提供流暢的動畫與響應式設計。支援 Android、iOS、Web、macOS、Windows 與 Linux,確保跨裝置的一致使用者體驗。適用於表單、過濾器與設定介面,透過直覺的互動模式提升易用性。

適用情境

  • 表單輸入
  • 篩選資料
  • 使用者偏好
  • 設定面板
  • 動態選擇清單
  • 多選下拉選單

主要特色

  • 可自訂樣式
  • 多選支援
  • 流暢的動畫
  • 跨平台相容性
  • 響應式設計
  • 輕鬆整合

適合對象

  • 開發表單的開發者
  • 尋求靈活性的UI設計師
  • 需要動態篩選的應用程式
  • 跨平台 Flutter 項目
  • 互動式使用者介面

使用建議

  • 可能需要額外的樣式來適應複雜佈局
  • 大資料集的效能影響
  • 有限的內建驗證
  • 未針對極長清單進行優化
  • 需要仔細的狀態管理
  • 依賴外部相依性以實現進階功能

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

ExtendableDropdown

A Versatile Flutter Package for Dynamic, Generic Dropdown Menus (v1.0.4)

Introducing ExtendableDropdown, a production-ready Flutter package that empowers you to create dynamic and expandable multiple dropdown menus with full support for generic data types.

🚀 Key Features

  • Generic Type Support: Handle any data type (T) with full type safety. No longer restricted to strings!
  • Dynamic Slot Management: Add or remove dropdown slots on the fly with a simple, intuitive UI.
  • Dismissible Interaction: Swipe-to-dismiss functionality for removing selections with item return logic.
  • labelBuilder API: Complete control over how your custom objects are rendered as text in the dropdown.
  • Configurable UI Fragments: Pass your own Widgets for the Add Button and custom callbacks for message handling.
  • Fully Mutable-Safe: Built with immutability in mind, following Flutter's best practices for widget design.

📦 Installation

Add extendable_dropdown as a dependency in your pubspec.yaml file:

dependencies:
  extendable_dropdown: ^1.0.4

Import the package in your Flutter code:

import 'package:extendable_dropdown/extendable_dropdown.dart';

🛠 Usage

Simple Usage (Strings)
List<String> cities = ['Colombo', 'Kandy', 'Galle', 'Jaffna'];

ExtendableDropdown<String>(
  list: cities,
  onSendListChanged: (selectedItems) {
    print('Selected cities: $selectedItems');
  },
)
Advanced Usage (Custom Objects & UI)

You can use any custom model and fully override the UI.

ExtendableDropdown<Location>(
  list: myLocationList,
  onSendListChanged: (selected) => print(selected),
  labelBuilder: (location) => location.name,
  // Completely custom add button
  addButton: ElevatedButton.icon(
    onPressed: null, // Logic is handled internally
    icon: Icon(Icons.add),
    label: Text("Add Location"),
  ),
  // Custom notification logic
  onMessage: (context, message) {
    MyCustomToast.show(message);
  },
)

🎨 Professional Customization

ExtendableDropdown comes with a wide range of styling options:

Property Description Default
list The initial list of items to choose from. Required
onSendListChanged Callback triggered when the selection changes. Required
labelBuilder Function to map generic items to strings. item.toString()
addButton Widget: Custom widget for the add button. Styled default button
onMessage Callback: Handle custom alerts/notifications. Default SnackBar
dismissibleBackgroundColor Color shown when swiping to delete. Colors.red
selectedIcon Icon shown for a selected slot. Icons.radio_button_checked
nonSelectedIcon Icon shown for an empty slot. Icons.location_on_outlined
dropdownBorderRadius Border radius of the dropdown container. 10.0
Check out the [example](file:///Users/mymac/Documents/MyProjects/extendable_dropdown/example/lib/main.dart) folder for a full implementation!

🚧 Roadmap

  • [x] Generic data type support (Completed)
  • [x] Improved state management and immutability (Completed)
  • [ ] Searchable dropdown options
  • [ ] Multi-select within a single dropdown slot
  • [ ] Custom animation support for slot addition

🤝 Contributing

We welcome your feedback and contributions! Please feel free to open issues or submit pull requests.

📄 License

This project is licensed under the MIT License - see the [LICENSE](file:///Users/mymac/Documents/MyProjects/extendable_dropdown/LICENSE) file for details.


Made with ❤️ by Chanuka Ranathunga

所屬分類

原始碼儲存庫

使用此套件的專案

暫無相關資料。