listview - React Native - 在特定位置滚动 ListView - 以编程方式

Question

在带有 Objective-C 的 iOS 中，我们可以制作 UITableView使用 scrollToRowAtIndexPath 滚动到特定的行索引方法，但在 React-Native 中我没有找到这种滚动方式 Listview在特定的行索引处。

场景如下，

1. 有 Listview有了这样的可扩展行，比如在点击它时它会扩展并且可扩展行包含 TextInput组件。
2. 在 TextInput 中输入文本时, 键盘将在此时出现，理想情况下 Listview应该向上滚动(一旦键盘放下 Listview 应该向下滚动到它之前的位置)。

这可以通过 Native-iOS 轻松实现，但我被 React-Native 困住了。

---

我尝试了以下方法，但效果不佳

有一个方法叫scrollTo(x:0,y:10,animated:true)在Listview组件(实际上是它的 Scrollview 方法)，它可以根据父 View 的 y 坐标 向上/向下滚动。

我在我的代码中成功地接收到键盘的向上和向下事件，基于此我可以以某种方式使用 scrollTo 进行管理。方法(通过计算y 坐标)当键盘起床时(如@Alexey 的回答中所述)但我不知道如何计算y 坐标 当键盘放下时？ (此时理想情况下， ListView 应向下滚动到其先前的位置)。

如有任何帮助或提示，我们将不胜感激!

Answer 1

行高 * 项目索引怎么样？假设您想滚动到 ListView 中的第 20 个元素。每行都有 height: 50。我们使用上面提到的公式计算第 20 个元素的偏移量:50 * 20 = 1000。然后使用 scrollTo(0, 1000) 并滚动到所需的元素。

为了能够向后滚动，您需要在应用 scrollTo 函数之前存储一个偏移量:

var scrollProperties = this.refs.listView.scrollProperties;
var scrollOffset = scrollProperties.contentLength - scrollProperties.visibleLength;

在连接键盘事件(DeviceEventEmitter 中的keyboardWillHide)后，您可以scrollTo 到前一个偏移量。