Animating layout components

A common use case is animating the entering and exiting layouts of your components. This means that when your component renders for the first time and when you unmount your component, it appears animated. React Native Reanimated is an API that lets you animate layouts and add animations such as FadeIn, BounceIn, and ZoomIn.

React Native Reanimated also provides a special Animated component that is the same as the Animated component in the Animated API, but with additional props:

• entering: Accepts a predefined animation when the component mounts and renders
• exiting: Accepts the same animation object, but it will be called when the component unmounts

Let’s create a simple to-do list with a button for creating tasks and a feature that allows us to delete tasks when we click on them.

It’s impossible to see animations in screenshots, so I suggest you open the code and try to implement the animations to...