我们已经开发了一个使用React Native PanResponder的swiper(在有人评论之前)-我们不能在这里使用任何其他swiper库。 在我们开发的swiper中,当用户结束滑动(即释放Pan)时,启动弹簧动画时会出现延迟的问题。
因此,为了解决这个问题,我们正在尝试从 React Native Animated API转移到 Reanimated Libary,这可以解决用户面临的延迟问题。
因此,为了解决这个问题,我们正在尝试从 React Native Animated API转移到 Reanimated Libary,这可以解决用户面临的延迟问题。
我正在添加我们用于在PanResponder中检测滑动方向的代码部分。但是,在使用 React Native Gesture Handler(PanGestureHandler)和Reanimated Library进行开发时,我们无法在手势处理程序中检测滑动方向。
onPanMoving = (evt, {dx}) => {
this.draggedEnd = dx < -this.swipeThreshold; //You are moving towards right screen
this.draggedStart = dx > this.swipeThreshold; //You are moving towards left screen
}
正如您所见,在PanResponder中检测pan移动方向是非常容易的。
这里出现了Gesture Handler的问题,
当手势状态处于活动状态时,我无法检测到swipe。
我已经在Gesture Handler中搜索了问题,并找到了this。
该问题中提出了两个解决方法。
- 第一个是由Sonaye提供的,它有两个处理程序并在两个处理程序的onHandlerStateChange中检测滑动方向,但在使用重新动画时并不实用,因为它仅在处理程序状态更改时设置滑动方向。
- 第二个是由Satya提供的,它实际上在状态为ACTIVE时检测滑动,但他使用了translationX属性,该属性对我们也可以是负的,并且可以像swiper一样向任何方向移动。
这两种解决方法都无法解决我们的问题。
那么,是否有其他方法可以使用PanGestureHandler和Reanimated找到方向?我尝试使用PanResponder和Reanimated与dx值一起使用,但最终出现了错误消息,即nativeEvent属性仅支持作为来自PanResponder的gestureState参数的dx。
注意:我们无法在Fling的onHandlerStateChange中使用FlingGestureHandler和Swipeables,因为我们需要找到方向,而Swipeables不使用Reanimated。