Flipkart / recyclerlistview

High performance listview for React Native and web!
Apache License 2.0
5.2k stars 426 forks source link

Query re rendering refresh process when updating state of dataProvider #569

Open mdarke1 opened 3 years ago

mdarke1 commented 3 years ago

I am wondering if there is a way of preventing the virtual renderer from displaying the old data of the dataProvider during a state update.

I am currently writing a functional drag and drop recyclerlistview based on Ben Awads youtube https://www.youtube.com/watch?v=qeKP2A7bLUw

This slightly amended version uses reanimated2 v2 and expo. Drag and drop is working effectively, with the other indirectly affected items springing to new positions on the screen.

However when useState is called to reset dataProvider on a panresponder release I've noted that the old cell data is briefly visible before rendering to the new cell data. Whilst that would be fine for items in list that have not had their position moved it is a major problem for animated items.

Is there any way of preventing this? I presume it is driven off of the virtual renderer which provides the data again to the list before rerendering.

The issue is in the case of drag drop the positions of the cell have moved from the initial rendering process. Therefore the items being moved are briefly flickering back to the old data that related to the previous state before updating.

This leaves a very poor user experience. I've played with stableId's but don't believe this solves the issue. I'd appreciate any guidance on this- given the awesome interface that reanimated2 has provided it would be a shame if its not possible to be used in conjunction with recyclerlistview.

elan commented 3 years ago

@mdarke1 ~ looking for drag and drop functionality over here too, and found myself to this GHI 😅

Any chance you're interested in collaborating/code-sharing?