The animation is not smooth when reloading icon appears

[xcatliu]

When pulling down, renderHeader suddenly append an element into ListView, it cause a UI shake, and make the remaining ListItems downward about 60 pt before touchend.

Is there anyway to prevent the downwarding?

[jsdf]

So I think the issue you're seeing is actually because sometimes the header (the 'refreshing' message) gets appended again when you scroll down, because the onScroll event fires again. The scroll event fires very infrequently (which is a react-native ScrollView bug), so it's difficult to compare multiple scroll events to figure out which direction the scrolling is happening in.

Does that sound like that could be the cause of the issue you're seeing, or is it something different?

[lelandrichardson]

@jsdf you should be able to add scrollEventThrottle={16} to the ScrollView and the onscroll event will then fire every frame.

[jsdf]

I just published a new version (0.3.1) so using that version and the latest version of react-native, this issue should be resolved

[xcatliu]

@jsdf @lelandrichardson

Maybe I did not make my question clear. So I made a gif to explain it:

When pulling about 40pt (default minPulldownDistance value) slowly, the reloading image suddenly appeared and made other items downward 60pt.

Is it clear?

[jsdf]

Ahh, yes, I see what you're talking about now. I'll have another look at it.

[jsdf]

I think you might be able to avoid the jump by playing with the contentInset/contentOffset props which can be passed to the RefreshableListView (and are passed through to the underlying ScrollView), however I haven't been able to figure out exactly what would need to be done. Presumably you would want to cancel out the height of the header by adding it to the contentInset?

[amccloud]

I'm observing this behavior also.

[umhan35]

Is there any solution for this? I'd say this is a bit annoying...

[jsdf]

I've tried a few things to fix it but it's a bit complicated so it will have to wait until I have more time to dig into it further.

[evanmrose]

+1, seeing this issue as well

[andrey-skl]

I guess we just should implement another header with message "pull down to refresh" and display it instead of loader while scrolling down before it is scrolled enough.

Native iOS libs do this successfully.

[JonasJonny]

+1

Maybe you can inspire here https://github.com/syrusakbary/react-native-refresher. Loading display is fine there.

[jsdf]

I'm taking all of this into account for v2, which will probably be implemented differently, as a separate layer to the usual ScrollView header, so there is no interference with the scroll position.

[RWOverdijk]

Is this issue still being worked on, or should I find my own solution? Just curious how to solve this.

[jsdf]

Still being worked on. I pushed a first attempt at v2 to master recently, but still have to update the docs and iron out some bugs

[RWOverdijk]

@jsdf Any help I could offer is fine with me.

[parmarnishant]

+1