在React Native ScrollView中检测滚动结束,对齐页面

Question

React Native ScrollView有一个prop pagingEnabled.但是,它假定ScrollView中每个页面(或子组件)的宽度等于ScrollView的宽度.

我们如何修复它以使其适用于小于ScrollView的页面？

是否可以检测用户何时停止滚动？然后我们可以轻松编写自己的代码以捕捉到正确的页面.

编辑:还有一些其他方法可以通过使用仅在iOS上提供的道具来修复此问题,因此这在Android上尤其成问题.

Answer 1

你可以设置两个不同的道具React Native ScrollView,它采用回调来通知滚动已经结束.(他们现在都有记录.)

用户放开ScrollView后立即调用(从屏幕上抬起手指).

~~工作样本:https~~:~~//rnplay.org/apps/Ufv6Cg~~(不再可用)

当ScrollView停止滑动时调用(在用户将手指从屏幕上抬起后,它通常会继续滑动一点).

~~工作样本:https~~:~~//rnplay.org/apps/BPgG_g~~(不再提供)

注意:我在API文档中找不到任何React Native组件的方法,但它们的工作方式如示例所示.我看见他们用在这里的反应,本机扣轮播.

奇怪的是,onScrollEndDrag不再列在反应原生API上,但仍然有效. (3认同)
还想添加`onScrollBeginDrag`是另一个在拖动开始时触发的问题https://github.com/facebook/react-native/blob/62b20ce582383dd36c07b5d541cde6a7d13cabc6/React/Views/RCTScrollView.h#L54 (2认同)
现在记录了'onMomentumScrollEnd`; 我已经打开PR来记录`onScrollEndDrag`和`onScrollBeginDrag`,网址是https://github.com/facebook/react-native/pull/17368和https://github.com/facebook/react-native-website/pull/99. (2认同)