[Reorderable ListView] Why the layout "jumps" when dragging an item from one position to another?

Widgets & Design

Hi everyone,

I’m working on a feature in FlutterFlow that allows users to reorder items (specifically images) in a listview. While the basic reordering functionality works, I’ve encountered an issue where the layout "jumps" when dragging an item from one position to another, especially when dragging an image from the top to the bottom of the list.

Here are the key issues I’m experiencing:

  • When dragging an item down the list, the images visually "jump" as they update to their new positions, rather than smoothly transitioning.

  • The list appears to rebuild abruptly during the reorder, causing a noticeable visual glitch.

  • I've tried disabling unnecessary rebuilds and adjusted the logic to handle the reordering, but the issue persists.

I would like to know if there's a way to make the reordering process smoother, possibly with animation or by optimizing how the list updates during reordering. Any suggestions on improving the visual fluidity of the item reordering would be much appreciated!

Follow an Video demo:
https://drive.google.com/file/d/1VkE4Cl_g28IlxYBjWQ1OZEVIFIospzjg/view?usp=sharing

What have you tried so far?

I've tried disabling unnecessary rebuilds and adjusted the logic to handle the reordering, but the issue persists.

Did you check FlutterFlow's Documentation for this topic?
No
3
10 replies