refreshControl doesn't work on Android

Description

If I use FlatList with a custom component as children, the refresh control doesn’t show up on Android.

Screenshots

Steps To Reproduce

If I do this, the RefreshControl is shown in iOS but not in Android

<FlatList
  keyExtractor={item => item.id}
  refreshControl={
    <RefreshControl refreshing={refreshing} onRefresh={_fetchFeed} />
  }
  renderItem={({item}) => {
    return <MyCustomCard />;
  }}
/>

https://user-images.githubusercontent.com/7424471/118709844-e3b29680-b7f3-11eb-9f3c-250947afd3f2.mp4

but if I do this, it’s shown on both platforms

<FlatList
  keyExtractor={item => item.id}
  refreshControl={
    <RefreshControl refreshing={refreshing} onRefresh={_fetchFeed} />
  }
  renderItem={({item}) => {
    return <Text>Some text</Text>;
  }}
/>

https://user-images.githubusercontent.com/7424471/118710143-47d55a80-b7f4-11eb-83e2-5fd4f7cb9e76.mp4

Package versions

• React: 17.0.1
• React Native: 0.64.0
• React Native Gesture Handler: 1.10.3

[yfunk]

This seems to be the same issue as #1067. While there are some workarounds over there, the general “solution” seems to be ditching react-native-gesture-handler and using the ScrollView (or in this case FlatList) from react-native instead.

[zhou9110]

Having the same issue in Android phones using library version 1.7.0, had no other workaround but to use the original FlatList from react-native

Package versions

React: 16.13.1 React Native: 0.64.1 (Expo 39) React Native Gesture Handler: 1.10.3