When using translateY, elements on Android become invisible after the 4th item in the list.

[EvgenMart]

When using translateY, elements on Android become invisible after the 4th item in the list.

For iOS, everything works as expected.

android

2024-12-30.14.16.49.mov

iOS

2024-12-30.14.17.20.mov

styles

const ITEM_HEIGHT = 150;

const animatedStyle = useAnimatedStyle(
() => {
const translateY = withTiming(
interpolate(
pullDownPosition.value,
[0, ITEM_HEIGHT * 2],
[0, -index * ITEM_HEIGHT],
Extrapolation.CLAMP
),
{
duration: 150,
easing: Easing.out(Easing.ease),
}
);
return {
transform: [{ translateY }],
zIndex: 1000 - index,
elevation: 1000 - index,
};
}, [pullDownPosition]);

I would greatly appreciate your help.

[MatiPl01]

Hey @EvgenMart!

Have you tried adding this prop removeClippedSubviews={false} to the FlatList component? If it doesn't help, can you possibly share the entire implementation to test it out?

[EvgenMart]

@MatiPl01, Thank you very much. That helped.