react-native-gesture-handler: [Android] Trying to use this library with wix/react-native-navigation throws error: `undefined is not an object (evaluating 'RNGestureHandlerModule.State')`

Thank you for putting together this awesome library 👍

I am facing a small issue while integrating it with react-native-tab-view and wix/react-native-navigation. I raised an issue to here.

I was checking the logs inside Android Studio and get an error saying:

undefined is not an object (evaluating ‘RNGestureHandlerModule.State’)

Relevant stack trace:

03-05 08:42:30.000 12426-12426/com.tabview_example E/unknown:ReactNative: Unable to display loading message because react activity isn't available

03-05 08:42:31.277 12426-12456/com.tabview_example E/ReactNativeJS: undefined is not an object (evaluating 'RNGestureHandlerModule.State')

03-05 08:42:31.282 12426-12426/com.tabview_example E/unknown:ReactNative: Unable to launch redbox because react activity is not available, here is the error that redbox would've displayed: undefined is not an object (evaluating 'RNGestureHandlerModule.State')

03-05 08:42:32.459 2120-2254/system_process E/TaskPersister: File error accessing recents 
directory (directory doesn't exist?).

Here’s the example repo with the change: https://github.com/ghoshabhi/rn-tabview-problem/commit/9d5b1eed6c8ab2adf716094e76a868fa44b016b0

When I run the app - I see a blank white screen with no error (you can see that in the first line of the error trace I have shared)

I am wrapping my navigation screens with the gestureHandlerRootHOC component too.

Am I missing something here ?

react-native: v0.54.0 react-native-gesture-handler: v1.0.0-alpha.41 react-native-tab-view: v0.0.74 react-native-navigation: v1.1.397

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 5
Comments: 22 (6 by maintainers)

Most upvoted comments

For React Native, follow these steps

remove node_modules and package-lock.json
npm install
npm install --save react-navigation
npm install --save react-native-gesture-handler
react-native link

im-hamza-dev on Dec 8, 2018

To make it work you need to modify MainApplication.java.

First, import the library : import com.swmansion.gesturehandler.react.RNGestureHandlerPackage; Second, modify getPackages method. It should look like this:

    protected List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
                new RNGestureHandlerPackage()
        );
    }

OmgDef on Dec 5, 2018

Ok fixed it!

In MainApplication.java 2 changes:


...

import com.swmansion.gesturehandler.react.RNGestureHandlerPackage; // <-- change 1

...

protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
    // eg. new VectorIconsPackage()
    new RNGestureHandlerPackage() // <-- change 2
  );
}

...

And follow these steps: https://kmagiera.github.io/react-native-gesture-handler/docs/getting-started.html#with-wix-react-native-navigation-https-githubcom-wix-react-native-navigation

I think we can close the issue.

Thank you for the library Magiera!

JohnnyDevX on Jan 16, 2019

I’ve added some comments on the commit you linked.

You haven’t added the package to the MainApplication.java or the required code to MainActivity.java https://github.com/ghoshabhi/rn-tabview-problem/blob/master/android/app/src/main/java/com/tabview_example/MainApplication.java#L22

That’ll probably fix your issue.

The example code might help - https://github.com/kmagiera/react-native-gesture-handler/tree/master/Example/android/app/src/main/java/com/swmansion/gesturehandler/react/example

AndrewJack on Mar 15, 2018