React Native - Detect Double Tap

index.js

var Index = React.createClass({

  getInitialState: function () {
    return {
      lastPress: 0
    }
  },

  onPress: function () {
    var delta = new Date().getTime() - this.state.lastPress;

    if(delta < 200) {
      // double tap happend
    }

    this.setState({
      lastPress: new Date().getTime()
    })
  },

  render: function() {
    return (
      <TouchableHighlight onPress={this.onPress}></TouchableHighlight>
    )
  }
});

@arfa123 have a look at my MultiTapOverlay component, just above your comment; does it work for you? Or do you need a component that will tell you how many taps was pressed (e.g. single, double triple, etc.), handling not only one case but many cases?

@yanickrochon did u read @iksent comment?

@fukemy I'm not certain what you mean, of course I have read @iksent 's comment. Back in 2020, React hooks were relatively new. So, if I would rewrite the code I posted, it would more look like this one, today :

const MultiPressOverlay: () => ReactNode = ({
  delayLongPress = 1000,
  delayMultiPress = 300,
  minMultiPress = 4,
  onPress,
  onLongPress,
  onMultiPress,
  children
}) => {
  const [lastPress, setLastPress] = useState(null);
  const [pressCount, setPressCount] = useState(0);

  useEffect(() => {
    if ((pressCount > 1) && (pressCount >= minMultiPress)) {
      setPressCount(0);
      onMultiPress && onMultiPress(new CustomEvent("multipress", { detail: { pressCount } }));
    }
  }, [pressCount, minMultiPress, onMultiPress]);

  const handlePress = evt => {
    const now = Date.now();

    setLastPress(now);
    if (now - lastPress <= delayMultiPress) {
       setPressCount(pressCount => pressCount + 1);
    } else {
      setPressCount(1);
    }

    onPress && onPress(evt);
  };

  return (
    <TouchableOpacity
      delayLongPress={ delayLongPress }
      activeOpacity={ 0.8 }
      onLongPress={ onLongPress }
      onPress={ handlePress }
    >
      { children }
    </TouchableOpacity>
  );
};

NOTE: There is still a lot of room for improvement, but this was written without tests whatsoever. I would move the onPress inside the useEffect callback, with a timer, to trigger a single press event is the delayMultiPress is expired and less than minMultiPress has beeen triggered, etc.