В настоящее время я использую ListView для отображения некоторых данных. Из-за дизайна строки занимают около 70% высоты экрана, что означает, что всегда видны как минимум 2 строки, максимум три. Я хотел бы определить, какая строка в основном видна.
В настоящее время я использую onChangeVisibleRows, но это просто говорит мне, какие строки видны или вошли или вышли из представления.
Любые идеи?
Это будет работать только тогда, когда вы знаете, что одновременно видны 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]
}
}
Предостережение в том, что он не идеально сопоставляется с наиболее заметной строкой, которая считается видимой. Тем не менее, его использование имеет смысл при прокрутке. В моем конкретном приложении наблюдается видимый сдвиг между активными и неактивными строками, что помогает пользователю понять, что произошло.
У меня нет достаточно времени, чтобы разработать точный алгоритм для вашей проблемы. Но вот что вы можете сделать-
Получить положение прокрутки. React native: получить текущую позицию прокрутки прокрутки
Получить высоту экрана. https://facebook.github.io/react-native/docs/dimensions.html#content
Рассчитать ок. высота дочернего элемента ListView.
Вы можете использовать эти три вещи, чтобы узнать, сколько места было занято конкретным дочерним элементом.
Получив положение прокрутки, вы можете узнать, на сколько пикселей вы прокрутили вниз. Разделите это на рост вашего ребенка, чтобы вы могли получить, сколько детей было прокручено пользователем.
(Scrolled height / Child height) = No. of children scrolled.
И, наконец, onChangeVisibleRows сообщит вам, какие дочерние элементы видны. Удачи!
