react-native-gesture-handler: Swipeable is not working on android

So i’m trying to use the Swipeable component from react-native-gesture-handler. The thing is that it does nothing. Below is my code

App.js

import Swipeable from 'react-native-gesture-handler/Swipeable';

const RightActions = () => {
  return (
    <TouchableOpacity onPress={() => console.warn('works'))}>
      <Icon name="md-trash" size={18} color={Colors.red} />
    </TouchableOpacity>
  );
};

const App = () => {
  return (
    <ScrollView>
    ...
      {Object.keys(data).map(key => {
        return (
          <Swipeable key={key} renderRightActions={RightActions}>
            <View>
              <Text>Swipe left</Text>
            </View>
          </Swipeable>
        );
      });
    </ScrollView>
  );
};

export default App;

And here is my MainActivity.java as it is suggested.

package com.assosfood;

import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

public class MainActivity extends ReactActivity {

    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    @Override
    protected String getMainComponentName() {
        return "assosfood";
    }

    @Override
    protected ReactActivityDelegate createReactActivityDelegate() {
        return new ReactActivityDelegate(this, getMainComponentName()) {
            @Override
            protected ReactRootView createRootView() {
                return new RNGestureHandlerEnabledRootView(MainActivity.this);
            }
        };
    }
}

This is all done with react-native not with expo. What am i doing wrong?

About this issue

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

Most upvoted comments

You’ll have to modify MainActivity.java:

Add:

import com.facebook.react.ReactActivityDelegate; import com.facebook.react.ReactRootView; import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

@Override protected ReactActivityDelegate createReactActivityDelegate() { return new ReactActivityDelegate(this, getMainComponentName()) { @Override protected ReactRootView createRootView() { return new RNGestureHandlerEnabledRootView(MainActivity.this); } }; }

So I made use of RN FlatList

To get it working on Android, I just had to wrap FlatList with <GestureHandlerRootView>

We are still having this issue on 0.61.0-rc2. Is this still one the radar for being fixed?

Try following installation instructions at updated link https://docs.swmansion.com/react-native-gesture-handler/docs

Works for me with v0.60.5

Facing the same issue. My version is v0.60.4 as well

My version is v0. 60.4 as well. I thought I was doing something wrong.

react-navigation uses this library for their drawer navigation. We have the same similar problem. The problem happens in v0.60.4. What’s your RN version by the way?