Question

我目前正在使用ListView来显示一些数据。由于设计原因，行占据屏幕高度的约70％，这意味着总共至少有2行可见，最多3行。我想确定哪一行大部分是可见的。

我目前正在使用onChangeVisibleRows，但这只是告诉我哪些行可见或已进入或离开了视图。

有什么想法吗？

Answer 1

只有当您知道一次可以显示2-3行（不多于，不少于）时，这才会起作用：

onChangeVisibleRows={(visibleRows) => {
    const visibleRowNumbers = Object.keys(visibleRows.s1).map((row) => parseInt(row));
    if (visibleRowNumbers.length === 2) {
        // visible row is visibleRowNumbers[0]
    }
    if (visibleRowNumbers.length === 3) {
        // visible row is visibleRowNumbers[1]
    }
}

警告说，它没有完美地映射到最明显的行被认为是可见的。但是，在使用它时，滚动时才有意义。在我的特定应用程序中，活动和非活动行之间存在明显的转换，因此它可以帮助用户了解发生了什么。

Answer 2

我没有足够的时间为您的问题设计准确的算法。但这是你可以做的 -

获取滚动位置。 React native: get current scroll position of scrollview
获取屏幕高度。 https://facebook.github.io/react-native/docs/dimensions.html#content
计算约。 ListView子项的高度。

您可以利用这三件事情来确定特定儿童占用的空间。

通过获取滚动位置，您可以知道向下滚动了多少像素。除以您孩子的身高，以便您可以获得用户滚动了多少孩子。

(Scrolled height / Child height) = No. of children scrolled.

最后，onChangeVisibleRows会告诉您哪些孩子可见。祝你好运！

如何确定scrollview（或listview）子项是否主要在React Native中查看

2 个答案: