react native FlatList on scroll combined
I got a FlatList, this works ok...
<FlatList ...
onScroll={
Animated.event(
[{ nativeEvent: { contentOffset: { x: scrollX } } }],
{
useNativeDriver: false,
}
)
}
now I want to combine above with active onScroll index...
<FlatList ...
onScroll={onScroll}
...
const onScroll = useCallback(
(event: NativeSyntheticEvent<NativeScrollEvent>) => {
const slideSize = event.nativeEvent.layoutMeasurement.width;
const index = event.nativeEvent.contentOffset.x / slideSize;
const roundIndex = Math.round(index);
console.log('roundIndex:', roundIndex);
//how to combine the below?
Animated.event([{ nativeEvent: { contentOffset: { x: scrollX } } }], {
useNativeDriver: false,
});
},
[]
);
Solution 1:
Use the OnEndReached
function of flatlist.
If you use onScroll
in Flatlist then sometimes its not working for the android, but for iOS it works.