[v4] [iOS] Pan down to close on BottomSheetScrollView not working (Scrollables)

[IngyuTae]

Bug

Environment info

• iOS simulator / own device
• Expo v44 managed app
• I was not able to reproduce on Snack (v43.0.0)

Library	Version
@gorhom/bottom-sheet	4.1.5
react-native	0.64.3
react-native-reanimated	2.3.3
react-native-gesture-handler	2.1.3

Steps To Reproduce

• Pan down on content of BottomSheetScrollView
• I expect BottomSheetModal starts to close when vertical offset === 0
• enablePanDownToClose no effect

Reproducible sample code

import * as React from 'react';
import { Text, View, StyleSheet, Button } from 'react-native';

import 'react-native-gesture-handler';
import { GestureHandlerRootView } from 'react-native-gesture-handler';

import {
  BottomSheetModal,
  BottomSheetModalProvider,
  BottomSheetScrollView,
} from '@gorhom/bottom-sheet';

export default function App() {
  const bottomSheetModalRef = React.useRef(null);
  const snapPoints = React.useMemo(() => ['50%'], []);

  const handlePresentModalPress = React.useCallback(() => {
    bottomSheetModalRef.current?.present();
  }, []);

  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <BottomSheetModalProvider>
        <View style={styles.container}>
          <Button onPress={handlePresentModalPress} title="Present Modal" />
          <BottomSheetModal ref={bottomSheetModalRef} snapPoints={snapPoints} enablePanDownToClose>
            <BottomSheetScrollView>
              <Text>Awesome 🎉</Text>
            </BottomSheetScrollView>
          </BottomSheetModal>
        </View>
      </BottomSheetModalProvider>
    </GestureHandlerRootView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingTop: 100,
    backgroundColor: 'lightgray',
  },
});

[nicencina]

I had the same problem, and I tracked it down to react-native-gesture-handler. I reverted to 1.10.2 from 2.2.0 and it started working again.

[eprice122]

+1

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[neocho]

@IngyuTae Where you able to figure this out?

[MichalKrakow]

Well, just another oversell - underdeliver package

[patrick91]

I tried downgrading to react-native-gesture-handler 1.10 but it didn't fix the issue :(

[thinhtt264]

this lib cant use in android? i coppied your code and it not run, cant scroll

[ser-emejia]

Any solution?

[MichalKrakow]

Do what facebook did, separate screen for comments on ios - lol.

[slytter]

I can confirm that building (using EAS) fixes this problem.
This is likely a problem with react-native-gesture-handler – I have previously experienced that react-native-gesture-handler have problems with handling simultaneous gestures using Expo Go.

This relates to this issue:
software-mansion/react-native-gesture-handler#1804

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[github-actions]

This issue was closed because it has been stalled for 5 days with no activity.