How to use universal-panresponder - 9 common examples

componentWillMount() {
    let that = this;
    this.panResponder = PanResponder.create({
      onStartShouldSetPanResponder: (evt) => {
        return true;
      },
      onMoveShouldSetPanResponder: (evt) => {
        return true;
      },
      onPanResponderMove: (evt, gestureState) => {
        const {dx, dy, vx, vy} = gestureState;
        const { onSwipeBegin, onSwipe, onSwipeEnd} = this.props;
        // when no swipe
        if (!this.props.continuous && this.swipeDetected) {
          return;
        }
        let initialDetection = false;
        let validHorizontal = false;
        let validVertical = false;

componentWillMount() {
    let that = this;
    this.panResponder = PanResponder.create({

      onStartShouldSetPanResponder: (evt) => {
        return true;
      },
      onMoveShouldSetPanResponder: (evt) => {
        return true;
      },
      onPanResponderMove: (evt, gestureState) => {
        const {dx, dy, vx, vy} = gestureState;
        const { onSwipeBegin, onSwipe, onSwipeEnd} = this.props;

        // 没有swipe的时候return掉
        if (!this.props.continuous && this.swipeDetected) {
          return;
        }

componentWillMount() {
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
      onPanResponderRelease: this._handlePanResponderEnd
    });
  }
  _handleStartShouldSetPanResponder = (evt, gestureState) => {

componentWillMount() {
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
      onMoveShouldSetPanResponder: this._handleMoveShouldSetPanResponder,
      onPanResponderGrant: this._handlePanResponderGrant,
      onPanResponderMove: this._handlePanResponderMove,
      onPanResponderRelease: this._handlePanResponderEnd,
      onPanResponderTerminate: this._handlePanResponderEnd,
    });
  }

constructor() {
    const config = {};
    Object.keys(EmptyPanHandlers).forEach((name: string) => {
      const fn = this[name];
      config[name] = fn.bind(this);
    });

    this.panHandlers = PanResponder.create(config).panHandlers;
  }
}

componentWillMount () {
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
      onMoveShouldSetPanResponder: this._handleMoveShouldSetPanResponder,
      onPanResponderGrant: this._handlePanResponderGrant,
      onPanResponderMove: this._handlePanResponderMove,
      onPanResponderRelease: this._handlePanResponderEnd,
      onPanResponderTerminate: this._handlePanResponderEnd,
    });
    this._previousLeft = 20;
    this._previousTop = 84;
    this._circleStyles = {
      style: {
        left: this._previousLeft,
        top: this._previousTop
      }
    };
  }

componentWillMount() {
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
      onMoveShouldSetPanResponder: this._handleMoveShouldSetPanResponder,
      onPanResponderGrant: this._handlePanResponderGrant,
      onPanResponderMove: this._handlePanResponderMove,
      onPanResponderRelease: this._handlePanResponderEnd,
      onPanResponderTerminate: this._handlePanResponderEnd,
    });
    this.previousPositionX = 0;
    this.totalWidth = this.props.totalWidth || width;
  }

componentWillMount() {
    this._animations = {
      xRotationPercentage: new Animated.Value(0),
      yRotationPercentage: new Animated.Value(0),
      xTranslationPercentage: new Animated.Value(0),
      yTranslationPercentage: new Animated.Value(0)
    };

    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: (evt, gestureState) => true,
      onStartShouldSetPanResponderCapture: (evt, gestureState) => true,
      onMoveShouldSetPanResponder: (evt, gestureState) => true,
      onMoveShouldSetPanResponderCapture: (evt, gestureState) => true,
      onPanResponderMove: (e, gestureState) => {
        var {
          pageX: x,
          pageY: y
        } = e.changedTouches[0];

        this._animations.xRotationPercentage.setValue(calculatePercentage(y, height));
        this._animations.yRotationPercentage.setValue(calculatePercentage(x, width) * -1);
        this._animations.xTranslationPercentage.setValue(calculatePercentage(x, width));
        this._animations.yTranslationPercentage.setValue(calculatePercentage(y, height));
      }
    });

componentWillMount() {
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: this._handleStartShouldSetPanResponder,
      onPanResponderRelease: this._handlePanResponderEnd
    });
  }
  _handleStartShouldSetPanResponder = (evt, gestureState) => {