CellRendererComponent prop does not work with Animated.Flatlist

[regalstreak]

Description

CellRendererComponent prop does not work with Animated.Flatlist

Steps to reproduce

Use a Animated.FlatList

Put in a CellRendererComponent prop

It wouldn't render on Android

Snack or a link to a repository

https://snack.expo.dev/wI0E5xWM3_QzmQbwRYnwV

Reanimated version

3.8.1

React Native version

0.73

Platforms

Android, iOS

JavaScript runtime

None

Workflow

None

Architecture

None

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

[hirbod]

This is expected:

react-native-reanimated/src/reanimated2/component/FlatList.tsx

Line 95 in f5dfead

CellRendererComponent={CellRendererComponent}

You could copy the implementation and adapt it to your needs instead of using Animated.FlastList.

[Latropos]

Yes, this is an expected behaviour. I can confirm that @hirbod suggestions above are very reliable and you can follow them to customise CellRendererComponent according to your needs

[el-banna]

I would really recommend thinking of a way to provide styles to each item's wrapper view.
A very common use case of CellRendererComponent is to set the zIndex of the items.

Copying the implementation of Animated.FlatList is kinda an overkill to achieve that. It also prevents us from getting any bug fixes that will be pushed for Animated.FlatList in the future.