No gestures detected on Android with react-native-gesture-handler 2.x

[giacomoarienti]

Describe the bug On Android is not possible to close the modal by swiping or tapping outside the modal.

Reproduce

• Android emulator
• Create a Modalize instance inside a View or SafeAreaView

Dependencies:

• react-native-gesture-handler: ~2.1.0
• react-native-modalize: ^2.0.13
• react-native: 0.64.3
• expo: ^44.0.0
• react-navigation/native: ^6.0.2,

[alexissanchezsequal]

Same problem only on android, on ios it closes when pressing outside the modal.

[TPausL]

same here

[petervistyan]

Does anyone find a workaround for this issue so far?

[giacomoarienti]

Does anyone find a workaround for this issue so far?

To close the modal I’ve added a cancel button that calls the close method of the modal ref

[Cmoen11]

Is there any news on this?

[jeremybarbet]

Hi, I haven't been able to look at it yet, but in the meantime I would recommend downgrading to RNGH v1.x.

I will eventually upgrade RNGH on my projects so I will need to fix it on Modalize. If anyone has a fix and want to open a PR before that, feel free, otherwise, please be patient, it might take a while

[perroudsky]

Hi Jeremy ! thanks again for that awesome package ! Just wondering, is there a timeline for the fix ?

[jeremybarbet]

I don't want to make false promise so I don't have any timeline. I started working on it here https://github.com/jeremybarbet/react-native-modalize/pull/227. It will be released as major with breaking changes once done

[perroudsky]

ok cool, thanks for the update !

[BloodyMonkey]

I'm very interested knowing that most of my projects are using Modalize

[edi]

Hi ... I decided to port all my modals to this project, just to find out it ain't working on Android .. damn. Guess I need to revert everything until this gets fixed ..

Hopefully it's sorted soon.

[BloodyMonkey]

Hi @jeremybarbet I see you updated reanimated branch with REANIMATED 2 and RNGH 2, and React Native >= 0.65 Unfortunately, i'm using expo 44 (latest) who use React Native 0.64.3 What's the part of Modalize who need React Native 0.65 ?

[edi]

@BloodyMonkey you can just use https://github.com/gorhom/react-native-bottom-sheet meanwhile.

Nice keyboard support, expo supported, reanimated 2, swipe to dismiss, snap points, etc.

[BloodyMonkey]

@edi Thanks, I was just thinking of using it but I was still hesitating. But at this point of my project i cannot wait longer...

[BloodyMonkey]

@edi @jeremybarbet I found a solution. Wrapping your root view inside <GestureHandlerRootView> fix the problem and the modal is swipeable again BUT doesn't work with withReactModal SO wrapping Modalize inside a Portal works great !

[Mcebrera]

@BloodyMonkey but is the modal content scrollable on Android? My modal is swipable when I wrapped it in GestureHandlerRootView but the inner content isn't scrollable.

Also getting a warning message: Warning: Cannot record touch end without a touch start. Touch End: %s Touch Bank: %s {"identifier":0,"pageX":0,"pageY":0,"timestamp":443417329} [null,{"touchActive":true,"startPageX":164.71102905273438,"startPageY":473.07342529296875,"startTimeStamp":443417215,"currentPageX":163.62037658691406,"currentPageY":500.80157470703125,"currentTimeStamp":443417328,"previousPageX":163.62037658691406,"previousPageY":475.9500732421875,"previousTimeStamp":443417312}]

[jobberma]

Any update for this please ? I updated to expo 44 and it uses RNGH 2. The modal opens but we can't swipe to close it on ANDROID, it works fine on IOS.

[dylvaz]

If anyone is still having issues with this I wrapped my root view (everything in my App.js return) in a <GestureHandlerRootView style={{ flex: 1 }}> and the modals swipe down on android AND the inner content is scrollable.

I am using RNGH v2.2 and tested it on my Samsung s10 with one ui v4.1.

Hope this helps 🙏

[abbas321]

Does anyone find a workaround? its not working on android.

[perroudsky]

@abbas321

@dylvaz solution does work !

[frankelly001]

Describe the bug On Android is not possible to close the modal by swiping or tapping outside the modal.

Reproduce

• Android emulator
• Create a Modalize instance inside a View or SafeAreaView

Dependencies:

• react-native-gesture-handler: ~2.1.0
• react-native-modalize: ^2.0.13
• react-native: 0.64.3
• expo: ^44.0.0
• react-navigation/native: ^6.0.2,

import gestureHandlerRootHOC from react-native-gesture-handler in your App.js then wrap ur App.js export with gestureHandlerRootHOC for example

import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
  
const App = () => {
    return (
       // your code to render your layout
     )
}

export default gestureHandlerRootHOC(App)

[luccameds]

@frankelly001 Thank you so much! You're a legend!

[frankelly001]

@frankelly001 Thank you so much! You're a legend!

You are welcome. 😎

[sarnakov]

When using with native-base: <GestureHandlerRootView style={{ flex: 1 }}> works just fine

[giacomoarienti]

Solution: wrap your root view in <GestureHandlerRootView style={{ flex: 1 }}>

[abeeku]

Still not working for me

[AmirSedaqat]

@BloodyMonkey

Thanks, fixed

[vaibhavshah0201]

Describe the bug On Android is not possible to close the modal by swiping or tapping outside the modal. Reproduce

• Android emulator
• Create a Modalize instance inside a View or SafeAreaView

Dependencies:

• react-native-gesture-handler: ~2.1.0
• react-native-modalize: ^2.0.13
• react-native: 0.64.3
• expo: ^44.0.0
• react-navigation/native: ^6.0.2,

import gestureHandlerRootHOC from react-native-gesture-handler in your App.js then wrap ur App.js export with gestureHandlerRootHOC for example

import {gestureHandlerRootHOC} from 'react-native-gesture-handler';
  
const App = () => {
    return (
       // your code to render your layout
     )
}

export default gestureHandlerRootHOC(App)

Hey, dude, this is actually working, one thing can you please help me with if I use this then it will not create an issue for another library in future ?

Thanks for your suggestion, really appreciate :)