Touch event too hard to trigger on Android about react-native-swipeout

[junshengpierre]

Hi, I've tried setting sensitivity to 1 but it's not working for me on an android device. The touch event is incredibly difficult to trigger and requires me to press the list item a few times quickly to work.
It works perfectly on an iOS device.

The following is my renderRow code:

<Swipeout
    scroll={event => this._allowScroll(event)}
    sensitivity={1}
    autoClose={true}
    right={swipeoutButtons}>
    <TouchableOpacity
       style={styles.transaction}
       key={rowData.id}
       onPress={() => { this._goToScreen(rowData) }}>
         <View style={styles.listItemContainer}
            {...}
          </View>
     </TouchableOpacity>
 </Swipeout>

react-native 0.40.0
Samsung Galaxy S6
Android 6.0.1

Anyone knows what I might have done wrong?

[braco]

@dancormier: would it make sense to add an onPress to the Swipeout component?

[esutton]

The Swipeout onOpen function appears to be *** super *** sensitive on Android.

Is there any configuration for sensitivity?

I have to press a ListView row 4 or 5 times. I have to press very deliberate and straight and perpendicular to the tablet.

See:
#78

Using:
Android 6.0
Nexus 7 tablet
"react": "15.0.2",
"react-native": "^0.26.2",
[email protected]

[esutton]

Using adb logacat, I can see that the _handlePanResponderGrant function gets called almost every time the ListView row is touched. Unless you press straight and quick ( not very easy ).

This seems to prevent the ListView row's onPress method being called. I assume until the gesture has ended?

https://github.com/dancormier/react-native-swipeout/blob/master/index.js

  _handlePanResponderGrant: function(e: Object, gestureState: Object) {
    console.log('_handlePanResponderGrant:', gestureState);
    if(this.props.onOpen){
      this.props.onOpen(this.props.sectionID, this.props.rowID);
    }
    this.refs.swipeoutContent.measure((ox, oy, width, height) => {
      this.setState({
        btnWidth: (width/5),
        btnsLeftWidth: this.props.left ? (width/5)*this.props.left.length : 0,
        btnsRightWidth: this.props.right ? (width/5)*this.props.right.length : 0,
        swiping: true,
        timeStart: (new Date()).getTime(),
      });
    });
  },

Perhaps there is someway to de-bounce or de-sensitive PanResponder to make it not detect a PAN gesture so easily? Set a deltaX or deltaY threshold?

I cannot find anything in the react-native PanResponder documentation.

06-07 15:48:55.681 11603 12179 I ReactNativeJS: '_handlePanResponderGrant:', { stateID: 0.45550999348051846,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   moveX: 482.1539611816406,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   moveY: 87,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   x0: 482.1539611816406,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   y0: 87,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   dx: 0,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   dy: 0,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   vx: -9.19479990933698e-7,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   vy: 1.608545913133419e-7,
06-07 15:48:55.681 11603 12179 I ReactNativeJS:   numberActiveTouches: 1,

https://facebook.github.io/react-native/docs/panresponder.html

[chkchk]

set sensitivity to 1, it works for me

[esutton]

@chkchk Thank you!

I searched this repo for "sensitivity".

I see it being used but not referenced. How can sensitivity be doing anything?

I will give it a try anyway.

https://github.com/dancormier/react-native-swipeout

Props

Prop	Type	Optional	Default	Description
autoClose	bool	Yes	false	auto close on button press
backgroundColor	string	Yes	'#dbddde'
close	bool	Yes		close swipeout
left	array	Yes	[]	swipeout buttons on left
onOpen	func	Yes
right	array	Yes	[]	swipeout buttons on right
scroll	func	Yes		prevent parent scroll
style	style	Yes		style of the container
sensitivity	number	Yes	0	change the sensitivity of gesture

[minzhitang]

thanks @chkchk works for me too

[philographer]

It works for me too nicely! Thanks

[wp2123]

Still hard to trigger onPress event of TouchableOpacity after set sensitivity to 1.
react-native 0.43.3
iPhone 6s

[benevbright]

I just published extension of Swipeout to make it works like Android behavior on Android.
Try this.
https://www.npmjs.com/package/react-native-swipeout-longpressforandroid