如何確定滾動視圖（或列表視圖）的孩子是否大部分在視圖中React Native

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

我沒有足夠的時間爲您的問題設計出準確的算法。但這裏是你可以做的 -

1. 獲取滾動位置。 React native: get current scroll position of scrollview

2. 獲取屏幕高度。 https://facebook.github.io/react-native/docs/dimensions.html#content

3. 計算約。 ListView子級的高度。

您可以利用這三件事來找出特定孩子已經佔用了多少空間。

通過獲取滾動位置，您可以知道您向下滾動了多少個像素。除以你的孩子的身高，這樣你可以得到有多少孩子被用戶滾動。

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

最後，onChangeVisibleRows會告訴你哪些孩子是可見的。祝你好運！