Делайте прокрутку, только если движение пальца превышает 20% экрана

Question

У меня есть режим прокрутки, содержащий список дочерних элементов (Webview - с вертикальной прокруткой). когда я пытаюсь прокрутить веб-просмотр по вертикали, есть отклонение или небольшое движение в родительском - горизонтальном направлении. Я пробовал передавать сообщения от детей к родителю для отключения или включения прокрутки, что медленно и не на 100% идеально. Есть ли способ добиться этого с помощью props в response-native-scrollview для android.

Спасибо.

Answer 1

Я нашел ответ на свой запрос, используя PanResponder из response-native.

componentWillMount() {
  this._panResponder = PanResponder.create({
    onMoveShouldSetPanResponder: (evt, gestureState) => {
      return Math.abs(gestureState.dx) > minDragWidth;
    },
    onPanResponderMove: (evt, gestureState) => {
      if(!this._swipeDirection) this.checkSwipeDirection(gestureState);
    },
    onPanResponderRelease: (evt, gestureState) => {
      this._swipeDirection = null;
    },
  });
}

, поэтому при запуске события касания и при продолжении перетаскивания эти функции будут вызываться соответственно .

проверив, является ли прокрутка горизонтальной или вертикальной, мы можем выполнять действия.

checkSwipeDirection(gestureState) {
  const isHorizontalSwipe = (Math.abs(gestureState.dx) > Math.abs(gestureState.dy * 3)) && 
  (Math.abs(gestureState.vx) > Math.abs(gestureState.vy * 3));

  if(isHorizontalSwipe) {
      this._swipeDirection = "horizontal";
      let index = (gestureState.dx > 0) ? this.state.paginationIndex - 1 : 
this.state.paginationIndex + 1;
      index = (index > 0) ? (index > (this.props.data.length - 1) ? (index - 1) : index) : 0;
      this._scrollToIndex(index, true);
      this.props.doRequiredAction({ index });
  } else {
      this._swipeDirection = "vertical";
  }
}

обращаясь к этому сообщению.