Master React Native Animations Course

Go from beginner to mastery of React Native animations. We'll walk you through each step from animating a simple box, understanding interpolation, all the way up to building a shared element photo grid! Get it at https://reactnativeanimations.com

Layout vs Animated

We'll quickly cover what each of these do. We'll focus more on the Animated library here, but I won't completely gloss over LayoutAnimation because it is important.

INTRODUCTION

Introduction

RESOURCES

Resources

LAYOUT VS ANIMATED

Layout

Animated

ANIMATED API

getLayout

Animated API

getTranslateTransform

addListener

setValue

Animated.Value

interpolate

Animated.parallel

Animated.ValueXY

stopAnimation

removeListener/removeAllListeners

start

Animated.decay

Animated.timing

setOffset

Animated.spring

flattenOffset

Animated.sequence

Animated.stagger

Animated.delay

Animated.event

Animated.createAnimatedComponent

INTERPOLATION

Interpolation

Colors

Degrees/Radians (Rotation)

Scale / Mapping Values

Clamp

HANDLING GESTURES / EVENTS

Handling Gestures/Events

PanResponder

Scroll

BASIC ANIMATIONS

Basics

Moving Square

Color Square

Rotate Square

Drag Square

ADVANCED ANIMATIONS

Animated

Master React Native Animations Course

Layout vs Animated