FlatList(from RNGH) can not scroll anymore after nested in PanGestureHandler
See original GitHub issuerender() { ... return ( <PanGestureHandler onGestureEvent={this._onPanGestureEvent}> <Animated.View style={{...}} > <FlatList data={data} renderItem={itemData => this.renderItem(itemData)} keyExtractor={item => "" + item.name + item.url}/> </Animated.View> </PanGestureHandler> ) }
Issue Analytics
- State:
- Created 4 years ago
- Comments:5 (1 by maintainers)
Top Results From Across the Web
React native Flatlist does not scroll inside the custom ...
Here is the updated version of your code. working fine on simulator import React, { useState, useEffect, useRef } from "react"; ...
Read more >Need help, Nested FlatList component will not scroll on mobile ...
You don't need both, FlatList itself is scrollable. They shouldn't be nested and you should be getting console warnings about it.
Read more >Troubleshooting | React Native Bottom Sheet - GitHub Pages
Adding horizontal FlatList or ScrollView is not working properly on Android. Due to wrapping the content and handle with TapGestureHandler & PanGestureHandler ......
Read more >How to Fix VirtualizedLists should never be nested inside ...
When developing with React Native and nesting FlatList or SectionList component inside a plain ScrollView, your debugger might display the ...
Read more >react-native-draggable-flatlist - npm
A drag-and-drop-enabled FlatList component for React Native. ... within a TabNavigator so that the list does not capture navigator gestures.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found

@yairopro Thanks a lot. My FlatList stopped scrolling after items were wrapped inside
PanGestureHandlerandminDeltaXworked for me.Hi @mxmzb From the GET STARTED:
So it seems the pan catches all touch events as long as it is configured to recognize it. You can configure the pan to tell it what gesture it should recognize and which not using its props like
minDeltaX,maxDeltaX,minDist, etc. Have a look on the doc 😉.