GitLocker: The Coding Marketplace

Description:

flutter tree

Flutter Tree #

Version1
Online Example
Install #
dependencies:
flutter_tree: ^2.0.0
copied to clipboard
Uasge #
First Step #
/// Your server data
final serverData = [
{
"checked": true,
"children": [
{
"checked": true,
"show": false,
"children": [],
"id": 11,
"pid": 1,
"text": "Child title 11",
},
],
"id": 1,
"pid": 0,
"show": false,
"text": "Parent title 1",
},
{
"checked": true,
"show": false,
"children": [],
"id": 2,
"pid": 0,
"text": "Parent title 2",
},
{
"checked": true,
"children": [],
"id": 3,
"pid": 0,
"show": false,
"text": "Parent title 3",
},
];

/// Map server data to tree node data
TreeNodeData mapServerDataToTreeData(Map data) {
return TreeNodeData(
extra: data,
title: data['text'],
expaned: data['show'],
checked: data['checked'],
children:
List.from(data['children'].map((x) => mapServerDataToTreeData(x))),
);
}

/// Generate tree data
List<TreeNodeData> treeData = List.generate(
serverData.length,
(index) => mapServerDataToTreeData(serverData[index]),
);
copied to clipboard
Basic #
TreeView(data: treeData)
copied to clipboard

Show Filter #
TreeView(
data: treeData,
showFilter: true,
),
copied to clipboard

Checked #
TreeView(
data: treeData,
showCheckBox: true,
),
copied to clipboard

Show Actions #
/// Make sure pass `append` function.

TreeView(
data: treeData,
showActions: true,
showCheckBox: true,
append: (parent) {
print(parent.extra);
return TreeNodeData(
title: 'Appended',
expaned: true,
checked: true,
children: [],
);
},
),
copied to clipboard

Bind Events #
TreeView(
data: treeData,
showActions: true,
showCheckBox: true,
append: (parent) {
return TreeNodeData(
title: 'Appended',
expaned: true,
checked: true,
children: [],
);
},
onTap: (node) {
print(node.extra);
},
onCheck: (checked, node) {
print(checked);
print(node.extra);
},
onCollapse: (node) {
print(node.extra);
},
onExpand: (node) {
print(node.extra);
},
onAppend: (node, parent) {
print(node.extra);
print(parent.extra);
},
onRemove: (node, parent) {
print(node.extra);
print(parent.extra);
},
),
copied to clipboard
Lazy load #
/// Create your load function, return list of TreeNodeData

Future<List<TreeNodeData>> _load(TreeNodeData parent) async {
await Future.delayed(const Duration(seconds: 1));
final data = [
TreeNodeData(
title: 'load1',
expaned: false,
checked: true,
children: [],
extra: null,
),
TreeNodeData(
title: 'load2',
expaned: false,
checked: false,
children: [],
extra: null,
),
];

return data;
}

TreeView(
data: treeData,
lazy: true,
load: _load,
onLoad: (node) {
print('onLoad');
print(node.extra);
},
),

copied to clipboard

All Props #

property
type
default
description
required

data
List<TreeNodeData>
[]
Tree data
true

lazy
bool
false
Lazy load node data
false

icon
Widget
Icons.expand_more
Tree icon
false

offsetLeft
double
24.0
Item padding left
false

showFilter
bool
false
Show tree filter
false

showActions
bool
false
Show node actions
false

showCheckBox
bool
false
Show node checkbox
false

onTap
Function(TreeNodeData)
null
Node tap callback
false

onExpand
Function(TreeNodeData)
null
Node expaned callback
false

onLoad
Function(TreeNodeData)
null
Node lazy load callback
false

onCollapse
Function(TreeNodeData)
null
Node collapse callback
false

onCheck
Function(bool, TreeNodeData)
null
Node check callback
false

onAppend
Function(TreeNodeData, TreeNodeData)
null
Node append callback
false

onRemove
Function(TreeNodeData, TreeNodeData)
null
Node remove callback
false

append
Function(TreeNodeData)
null
Append node data function
false

load
Future<List<TreeNodeData>> Function(TreeNodeData)
null
Load node data function
false

TODO #

❌ Draggable tree
❌ Custom filter function

Contribute #

Fork it (https://github.com/xrr2016/flutter_tree.git)
Create your feature branch (git checkout -b feature/foo)
Commit your changes (git commit -am 'Add some foo')
Push to the branch (git push origin feature/foo)
Create a new Pull Request

License #
MIT
Stargazers over time #