react-native-reanimated: 3.0.0-rc.9 , useAnimatedScrollHandler with FlashList not working,
Description
No event emitted, when using Flashlist or MasonryFlashlist with Reanimated
Steps to reproduce
const AnimatedFlashList = Animated.createAnimatedComponent(MasonryFlashList);
const scrollHandler = useAnimatedScrollHandler(
{
onBeginDrag: () => {
cancelAnimation(scrollY);
},
onScroll: event => {
'worklet';
scrollY.value = clamp(
event.contentOffset.y,
-SIZES.screenHeight,
HEADER_PROFILE_HEIGHT - heightMenu - 2 * theme.spacing.s,
);
},
onMomentumEnd: () => {
cancelAnimation(scrollY);
},
},
[],
);
<AnimatedFlashList
onScroll={scrollHandler}
renderItem={renderItem}
/>
Snack or a link to a repository
https://gist.github.com/hamdij0maa/c9ed404672e2c70871495fd579350f09
Reanimated version
3.0.0-rc.9
React Native version
0.70.6
Platforms
Android, iOS
JavaScript runtime
Hermes
Workflow
Expo bare workflow
Architecture
Paper (Old Architecture)
Build type
Debug mode
Device
iOS simulator
Device model
iPhone 14 Pro
Acknowledgements
Yes
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Comments: 23 (10 by maintainers)
Commits related to this issue
- Fix useAnimatedScrollHandler when using FlashList (#3899) <!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please follow the template so that t... — committed to software-mansion/react-native-reanimated by graszka22 a year ago
- Fix useAnimatedScrollHandler when using FlashList (#3899) <!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please follow the template so that t... — committed to wordpress-mobile/react-native-reanimated by graszka22 a year ago
Yeah, the one with
getScrollableNode
could also fix the issue for 3.0.0-rc.x as wellI am having the same issue. useAnimatedScrollHandler no longer works as expected.
UPDATE: once we remove the onRefresh={} or refreshControl={} it bring back the useAnimatedScrollHandler. But we really need the refreshControl to have ability for pull to refresh
@tomekzaw: I have just submit a pull request from here:
https://github.com/software-mansion/react-native-reanimated/pull/3938
Thanks @orekasep, are you willing to submit a PR with this fix?
Leaving this here, it seems that they try to better handle the ref: https://github.com/Shopify/flash-list/pull/381/files
@hamdij0maa this is fixed on
2.14.1
that is coming out any moment nowHaving same issue, Any update on this?