Dismissible and implicitly_animated_reorderable_list

[giorgio79]

Just tried wrapping the Animated Item in Dismissible, but getting an error https://stackoverflow.com/questions/55792521/how-to-fix-a-dismissed-dismissible-widget-is-still-part-of-the-tree-error-in

will try to get a full example going...

PS It looks like the animation is carried out twice, once by Dismissible, and then by Implicitly_animated_reorderable_list. Perhaps need to override somehow the removedItemBuilder to avoid animation if Dismissible was used...

PS2 Looks like the example uses the Flutter Slideable package. Gonna check it out. https://github.com/wwwdata/implicitly_animated_reorderable_list/blob/479c09211e5b02093e294ca7c573f98f43c62124/example/lib/ui/lang_page.dart

itemBuilder: (context, animation, item, index) {
// Specifiy a transition to be used by the ImplicitlyAnimatedList.
// See the Transitions section on how to import this transition.
return Dismissible(
...
child: SizeFadeTransition(
sizeFraction: 0.7,
curve: Curves.easeInOut,
animation: animation,
child: Text(item.name),
);
},

[giorgio79]

Found a nice solution here that explains how to use Dismissible with Animated List https://morthor.medium.com/flutter-animatedlist-sizetransition-dismissible-dce49c11200d

void removeItem(String item, int index){ animatedListKey .currentState .removeItem(index, (context, animation) { return SizedBox(width: 0, height: 0); }); list. Remove(item); }

We will use the removeItem method from our AnimatedList, using its key, to make sure the item is removed from it, but because we are using the Dismissible Widget’s animation, we will only return an invisible, empty box. A SizedBox Widget with Zero height and width. This ensures that there is no interference.

[wwwdata]

yes, Dismissible is running its own animation when the user slides the item to remove it. So you need to disable the removal animation in that case from the animated list

[giorgio79]

Thx Ben, yeah I got it working via a regular Animated List, but still saw a flicker with Animated_List_Plus unfortunately. Dont know if animatedListKey solution also works with Animated_List_Plus

[cachapa]

I adapted from the above solution by temporarily storing the id of the item being deleted, and in the list.build method if the item matches, then it just returns an empty SizedBox while the Dismissible does its thing.

[makoConstruct]

It seems like this is largely due to an async yield happening in the didUpdateWidget, meaning the animated list doesn't actually update on the same frame as the dismissible is removed (happens on the frame after). didUpdateWidget/its caller is synchronous, so if you await anything, the awaited code (myersdiff) runs after the widget tree is built, so the dismissed item wont be removed in time.

There's no way to block on a future in dart, so fixing this would require making MyersDiff synchronous or making Dismissible more tolerant of being retained. Making MyersDiff synchronous would be easier. So shall we do that?

I looked in on the project MyersDiff was taken from, animated_stream_list, it sounds like that might be a much more async context where this would be less of a problem?

[wwwdata]

Please post a full example that reproduces the error so we have something to reproduce and talk about.

[makoConstruct]

@wwwdata There seems to already be one here #23

To answer your suggestion there: I sometimes want to delete items from the list, in a different way, not via the dismissable, and I want those other removals to animate as well. (I tried looking for ways of triggering the dismissible programatically and kinda couldn't see any)

Please tell us why the method is asynchronous! Have you personally been in situations where your lists were so long and your edits so complicated that you needed to run the myers diff in an isolate?

[makoConstruct]

Or, how about we just make asynchronous MyersDiff optional (a parameter of ImplicitlyAnimatedList), and have it default to false?