[v4] Backdrop press to close and enablePanDownToClose doesn't work on physical Android devices

Bug

Backdrop press to close and enablePanDownToClose doesn’t work on physical Android devices.

Children of the bottom sheet are clickable, but backdrop doesn’t react to touches, as does the pan down to close.

Tested on all versions of v4. The backdrop press works on v2.

v4 - both features do work fine on iOS.

v2 Doesn’t allow to swipe down on physical Android devices even with snapPoints set to [-250,250].

Environment info

Xiaomi Redmi Note 8 Pro

Library	Version
@gorhom/bottom-sheet	4.1.0
react-native	0.64.2
react-native-reanimated	2.2.2
react-native-gesture-handler	1.10.3

Steps To Reproduce

1. Open the screen with bottom sheet included
2. Open the bottom sheet
3. Press on the backdrop (nothing happens)
4. Pan down to close (nothing happens)

Describe what you expected to happen:

1. Press on backdrop should close the bottom sheet.
2. Pan down should close the bottom sheet.

Reproducible sample code

import React, { useCallback } from 'react';
import { Text } from 'react-native';
import BottomSheet, { BottomSheetBackdrop } from '@gorhom/bottom-sheet';

export const RateAppSheet: React.FC =  () => {

    const renderBackdrop = useCallback(
      props => <BottomSheetBackdrop disappearsOnIndex={-1} appearsOnIndex={0} {...props} />,
      [],
    );

    return (
      <BottomSheet
        ref={ref}
        index={-1}
        enablePanDownToClose={true}
        snapPoints={[250]}
        backdropComponent={renderBackdrop}
      >
        <Text>Hello, the backdrop and pan down isn't working on physical android devices on v4</Text>
      </BottomSheet>
    );
  },
);

[lukebars]

I was missing the GestureHandlerRootView wrapper in my App. Works alright now.

[projodesign]

I was missing the GestureHandlerRootView wrapper in my App. Works alright now.

This solved it for me also. For others that see a broken screen - you may need to add style={{flex:1}} to the <GestureHandlerRootView /> tag.