Question

我想在ScrollView上有一个onScroll事件，但在Swiper上有onSwipe事件。在此回调中，我希望获得“刷卡进度”（例如，将50％刷到第二项）。使用所有受支持的回调，当滑动开始或结束时，我可以执行某些操作，但是我也希望介于两者之间的所有步骤。我该怎么办？

Answer 1

获取当前视图的滚动位置

Swiper组件是ScrollView，您也可以将其本机道具与Swiper一起使用，对于您的情况，请使用onScroll道具来获取滚动位置和百分比掉了。

const viewWidth = Dimensions.get('window').width;

...

<Swiper
   scrollEventThrottle={16}
   onScroll={(e) =>
     const scrolledPercentage =(e.nativeEvent.contentOffset.x / (viewWidth * (this.currentIndex + 1)));
       }
>
...
</Swiper>

。

获取已通过视图的进度

只需使用onIndexChanged个道具获取当前索引，然后使用滑动器内部的Views计数来计算进度

<Swiper 
  style={styles.wrapper} 
  showsButtons={true} 
  onIndexChanged={(index) => {

   let progress= index/totalNumberOfView
   let progressInPercentage = Math.floor(progress*100)

   this.setState({
    progress,
    progressInPercentage
   })
  }
>

有没有办法获得react-native-swiper的滑动进度？

1 个答案: