Я использую FlatList для загрузки и прокрутки. Я столкнулся с проблемой, когда иногда пользователю нужно дважды щелкнуть (кнопка вниз на крестовине), чтобы изменить фокус. Один для переноса представления в область просмотра, а другой для изменения фокуса.
<FlatList
ref={pageRef}
style={{ flex: 1, width: p(1920) }}
data={getData()}
showsVerticalScrollIndicator={false}
removeClippedSubViews
onEndReached={getNewPage}
keyExtractor={(item) => item.contentGroupId}
getItemLayout={getItemLayout}
ListFooterComponent={
<View style={{ height: p(234) }} accessible={false} />
}
renderItem={({ item, index }) => (rowRenderer(item, index))}
/>
Я использую getItemLayout, чтобы указать высоту строк
const getItemLayout = (dat, index) => {
const lay = {
length: getDimensions(index).height,
offset: getDimensions(index).height * index ,
index
}
return lay
}
Я использую TouchableOpacity для визуализировать элементы и сфокусировать их.
Как я могу убедиться, что элементы прокручиваются правильно и при однократном щелчке (кнопка вниз) фокус должен смениться на следующий TouchableOpacity