This tutorial unveils the simplicity and ease of using the Layout Transitions from Reanimated.
In detail, as always, we're going to recreate this Checkbox Interactions demo from scratch starting with a lovely blank expo project.
Do you like React Native animations?
My React Native animations course: https://reanimate.dev
Shared 100+ Animations on Demos: https://reactiive.io/demos
Twitter: https://twitter.com/reactiive_
Source code: https://github.com/enzomanuelmangano/animate-with-reanimated/tree/main/src/animations/23-checkbox-interactions
Chapters:
00:00 Introduction
02:08 Packages walkthrough
04:11 Our very long initial boilerplate
15:20 The checked and unchecked UI
19:20 Adding the left icon
22:20 Checking and unchecking (dealing with the state)
25:00 Adding the Layout animations (finally)
29:37 Fine-tuning the color animations