selectable_draggable_listbox

Last updated:

0 purchases

selectable_draggable_listbox Image
selectable_draggable_listbox Images
Add to Cart

Description:

selectable draggable listbox

selectable_draggable_listbox #
Listbox with multiselect, drag & drop between lists, and reorder built in.
Features #

Bind your data to a listview of custom widget

Simple text item widget -or-
Templated list item widget for more cusomizability


Multi-select items

Shift-click to select items in sequence
Ctrl/Cmd-click to select individual items
Single-select only option available


Reorderable

Click & drag the "three lines" icon to reorder item


Drag & Drop

Drag items from/to different lists
Each list may independently be a draggable, drop target, or both




Getting started #

Add the latest version of this package:


Run flutter pub add selectable_draggable_listbox -or-
Edit pubspec.yaml and then run flutter pub get:

dependencies:
selectable_draggable_listbox: ^latest_version
copied to clipboard

Import the package

import 'package:selectable_draggable_listbox/selectable_draggable_listbox.dart';
copied to clipboard
Usage #
// Create your list and transform it to track selected items (list can be complex objects instead):
final myList = ['Apples','Cheese','Bread','Milk'].forListbox().toList();

// Create the listbox widget
return Listbox(
items: myList,
itemTemplate: (context, eventManager, index, item, onSelect) {
// Define the template used for each listitem
return SimpleListboxItem(
key: Key('$index'), // Key is required for reordering
item: item,
label: item.data,
eventManager: eventManager,
onSelect: onSelect,
);
},
onSelect: (itemsSelected) {
// React to items selected
// Note: (value of isSelected is not set automatically by Listbox,
// due to not knowing how your state is handled)
setState(() {
for (var item in myList) {
item.isSelected = itemsSelected.contains(item);
}
});
},
onReorder: (oldIndex, newIndex) {
// React to item reordered
setState(() {
// Note: this is an extension provided by the package
myList.move(oldIndex, newIndex);
});
},
);
copied to clipboard
Advanced Usage #
For more info on additional features like Drag & Drop and Customizable Templates, see examples and API:

Example
API

Support #
You can support me by buying me a coffee
And also don't forget to star this package on GitHub

License:

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Files In This Product:

Customer Reviews

There are no reviews.