Problem with slider inside BottomSheet on Android

I have the same problem when try using ScrollView with horizontal inside BottomSheet And I solve it after change import from react-native to react-native-gesture-handler. 👯 👯 👯 👯 👯

Ok I found temporary and working solution 😃

In my example I’m using reanimated-bottom-sheet with react-native-snap-carousel inside ScrollView.

I had to add state which we will be using to enable/disable gesture interaction and enable it during onTouchStart on container with that element.

Simple example

this.state = {
   isHorizontalScrollingEnabled: false,
}

--

 _handleHorizontalScrollingEnable = () => {
  this.setState({
    isHorizontalScrollingEnabled: true,
  });
};

  _handleHorizontalScrollingDisable = () => {
  this.setState({
    isHorizontalScrollingEnabled: false,
  });
};

--

<BottomSheet
  [...]
  enabledGestureInteraction={!this.state.isHorizontalScrollingEnabled}
  renderContent={() => (
    <PanGestureHandler
      activeOffsetY={5}
      failOffsetY={-5}
      onGestureEvent={this._onScrollDown}
      [...]
    >
      <ScrollView [...]>
        <View onTouchStart={this._handleHorizontalScrollingEnable}>
           // Our part of code with horizontal scrolling - in my case react-native-snap-carousel
        </View>
      </ScrollView>
    </PanGestureHandler>
  )}
/>

I didn’t check if that work with native scroll, but with react-native-snap-carousel In renderContent section works 😃 PanGestureHandler is the approach from there: https://github.com/software-mansion/react-native-gesture-handler/issues/420#issuecomment-457499442 and in onScrollDown function i disabling horizontal scrolling.

Maybe that will be helpful for someone