React-native-gesture-handler: PanGestureHandler doesn't work with WebView as child

Created on 21 Jun 2019  路  9Comments  路  Source: software-mansion/react-native-gesture-handler

Hi, I'm working only on iOS right now and when I put a WebView (react-native-webview) in a PanGestureHandler, I get no response from onGestureEvent.

If I put a normal, empty View inside, I get data from onGestureEvent

react-native v0.59.9
react-native-gesture-handler v1.3.0

Gesture handlers

Most helpful comment

Seeing same issue with WebView as child for PanGestureHandler, getting no response from onGestureEvent or onHandlerStateChange. Wrapping in View does not work for me.

All 9 comments

  _onPanGestureEvent = () => {
    log('got something')
  }

  _render_web_view = () => {
       return <WebView 
         style={{
           marginTop: 20,
           height: height,
           width: width,
         }}
         scrollable={false}
         source={ require('./canvas.html') }
       />
  }

  _render_empty_view = ()=> {
    return<View
      style={ styles.container }
    />
  }

  render() {
    return (
      <PanGestureHandler
        onGestureEvent={this._onPanGestureEvent}>      
        {  this._render_web_view() }
       {  /* this._render_empty_view()*/ }
     </PanGestureHandler>
    );
  }

Wrapping the WebView in another View with flex:1 works, but why doesn't it work without a wrapper?

seeing the same thing - though wrapping the WebView with a View and flex:1 does not help for me

The flex:1 workaround seems to work for iOS but not for Android. Although we can add a FlingGestureHandler a single-tap does not work as expected on android. The webview will focus links but will not follow them when tapping. Do you have a workaround for this as well?

Seeing same issue with WebView as child for PanGestureHandler, getting no response from onGestureEvent or onHandlerStateChange. Wrapping in View does not work for me.

Could you please provide a small code example showing this problem?

I think that the issue is inside alghoritm that check the child inside ViewGroup that can handle the touch but WebView on android is a ViewGroup without child so is skipped.

my workaroud is the following:
image

What happens if you wrap WebView with NativeViewGestureHandler?

Has anyone managed to get this working? I'm trying to add a WebView to the BottomSheet example but haven't had any luck.

Was this page helpful?
0 / 5 - 0 ratings