Reputation: 960
I have a list of widgets wrapped in a ReorderableList
that are pretty huge, and so I wish to achieve the effect of "collapsing" certain parts of the widget while the reordering is happening.
Here's what I have achieved so far:
return ReorderableListView(
onReorderEnd: (index) {
setState(() {
shouldCollapse = true;
});
},
onReorderStart: (index) {
setState(() {
shouldCollapse = true;
});
},
onReorder: (int oldIndex, int newIndex) async {
// Some code for reodering
},
children: [
BigWidget(shouldCollapse:shouldCollapse);
],
);
However, this does not fully achieve the intended effect.
=> The item that's being reordered does not collapse
Questions:
EDIT: Here is the current effect:
Code for BigWidget
class BigWidget extends ConsumerWidget {
final bool shouldCollapse;
BigWidget({
Key? key,
required this.shouldCollapse,
}) : super(key: key);
@override
Widget build(BuildContext context, WidgetRef ref) {
return Card(
elevation: 0,
child:
if (shouldCollapse == false)
// Display logic for the hidden items
//Rest of widget
);
}
}
Update 2:
Dartpad example: (fixed link)
Upvotes: 1
Views: 230
Reputation: 837
I went through the source code of ReorderableList
turns out the re-ordering widget is not rebuilt by default during the process of re-ordering.
If you want it to be rebuilt or animationed, use the proxyDecorator callback.
ReorderableList(
...
proxyDecorator: (child, index, animation) {
return BigWidget(shouldCollapse: true);
},)
Let me know if this works
Upvotes: 1