tree_view_with_drag_and_drop library
A Flutter package that provides a customizable tree view with drag-and-drop support.
This package allows you to display hierarchical data in a tree structure with the ability to reorder nodes via intuitive drag-and-drop interactions.
Features
- Generic Data Support: Use any data type with
TreeNode<T> - Drag & Drop: Reorder nodes by dragging and dropping
- Customizable: Customize appearance and behavior
- Expand/Collapse: Show or hide child nodes
- Controller: Programmatically control the tree
Usage
import 'package:tree_view_with_drag_and_drop/flutter_tree_drag_drop.dart';
// Create tree nodes
final nodes = [
TreeNode<String>(
id: '1',
data: 'Parent',
children: [
TreeNode<String>(id: '1.1', data: 'Child 1'),
TreeNode<String>(id: '1.2', data: 'Child 2'),
],
),
];
// Use in a widget
TreeView<String>(
nodes: nodes,
itemBuilder: (context, node, isExpanded) {
return ListTile(
title: Text(node.data),
leading: Icon(node.hasChildren ? Icons.folder : Icons.file),
onTap: node.hasChildren
? () {
node.isExpanded = !node.isExpanded;
}
: null,
);
},
onReorder: (draggedNode, targetNode, position) {
print('Node ${draggedNode.id} moved to ${position} of ${targetNode.id}');
},
)
Classes
-
DraggableTreeItem<
T> - A draggable and droppable tree item widget.
- TreeItemConfig
- Configuration for the tree item appearance
-
TreeNode<
T> - A node in the tree structure that can hold custom data of any type.
-
TreeView<
T> - A customizable tree view widget with drag-and-drop support.
-
TreeViewController<
T> - Controller for programmatically manipulating the tree view
Enums
- DropPosition
- Represents the position where a dragged node can be dropped relative to the target node.