Animated FlatList in React Native (Reanimated)

What's up mobile devs?
Today we're going to build from scratch a super powerful and simple animation over the React Native FlatList component.

If you like this tutorial, don't forget to subscribe to the channel :)

Chapters:
00:00 Introduction
00:43 Setup
04:39 Exploring onViewableItemsChanged
06:28 Preparing the Animation
10:15 Which item "isVisible"?
12:52 Scaling animation
13:34 Final thoughts

[fabrizia]

So excited to watch a new video from your channel🧐 keep it up!

[VictorDequidt]

Yeah new video !! Nice :D ! Keep it up !

[felipemelendez]

Another awesome tutorial from you and another great gift for us, thank you!

[MH-ztdo]

Awesome stuff!
Thank you so much for creating these videos and sharing knowledge 🙏

[ejikeezekwunem]

I can't thank you enough for these awesome tutorial series. Thank you so much

[DigitalAndTradingSolutions]

another simple yet very useful video watched, created by a really master of animation

[dglalperen]

So underrated !!! thanks for the quality content

[bayramarif]

very good... but iterating over the all array again in every single item might not be the best practive i think. becouse thats 50x50 iterations in your use case

[rubenjamesdelacruz]

Im experiencing an issue wherein, when im calling a Useeffect with a dispatch within the screen. it causes, an error stating `Invariant Violation: Changing onViewableItemsChanged on the fly is not supported`. seems to me this will only work on static datas.

[tuan]

*very good.... but i can't handle pagination with it, system gives error: "Invariant Violation: Changing onViewableItemsChanged on the fly is not supported", please help me*

[tuan]

*i have 1 textinput box in screen, when i type from keyboard, the system gives error: "Invariant Violation: Changing onViewableItemsChanged on the fly is not supported", please help me*

[alirezahadjar]

Nice job.
I think it is possible to use this method to simulate the mesaages app on ios. (Little movement of items when they become visible). Am I right?

[patricio]

I get this error at scrolling :( Invariant Violation: Changing onViewableItemsChanged on the fly is not supported

[MuhammadHussain-codr]

Make animation go to a specific point for reference deleting a list item will pop and go to dustbin with animatiom

[slemaniit]

I really liked your tutorial, and I know you most likely using Expo can you create a React Native project, and install and configure Reanimated without Expo? (If it is possible)

[XAH]

What about android? During the animation on android there are strong twitches and the animation in general works strangely.

[saviodev]

in my project, even with React.memo, dont re render in ListItem :(

[hoangtranvietdev]

Awesome!
please let me know snippet you used. thanks!

[-manikandan]

Regular videos put reactnative with typescript please

[macon]

instead of "Boolean(array.filter())" you can also use - "array.some()"