React Native ⚛️ Animation Libraries easy to use!
Tags: reactnative, javascript, typescript
Published: 2021-03-17 18:08:02

I love animations and spend much time doing some of them, some times I just want some quick and beautiful, so I use these libraries, if you love animation too and have no much time to spend, I will show some libs very easy to use and that will speed up this process for you.

> Hey, i updated this article o [my own blog, check it here!](https://www.tuliocalil.com.br/post/react-native-animation-libraries-easy-to-use)!

 * [ Shared elements animation](#shared-elements-animation)  
 * [ Animation frame by frame with dragging and more!](#animation-frame-by-frame-with-dragging-and-more)  
 * [ 3D models on your React native app!](#3d-models-on-your-react-native-app)  
 * [ Declarative transitions and animations](#declarative-transitions-and-animations)  
 * [ Animations from Adobe After Effects](#animations-from-adobe-after-effects)  
 * [ Conclusion and some mentions](#conclusion-and-some-mentions) 

###### generated with [Summaryze Forem 🌱](https://summaryze-forem.vercel.app/)

## Shared elements animation
This animations effect is so smooth and satisfactory to see, normally is hard to create too, but with [React native magic move](https://github.com/IjzerenHein/react-native-magic-move) is very simple to implement it.
![](https://github.com/IjzerenHein/react-native-magic-move/raw/master/magicmove5.gif)

## Animation frame by frame with dragging and more!
If you already felt the necessity of animations frame by frame or more detailed, this lib is for you, [React native animated sprite](https://github.com/micahrye/react-native-animated-sprite) creates animations based on frames and makes it possible to drag and create tweens.

![](https://raw.githubusercontent.com/micahrye/react-native-animated-sprite/master/example/AnimateSpriteExample.gif)

## 3D models on your React native app!
With [React Native GL Model View](https://github.com/rastapasta/react-native-gl-model-view) you can easily import Wavefront(.OBJ) files and display, scale, rotate, translate or animate 3D textured models.
![](https://github.com/rastapasta/react-native-gl-model-view/raw/master/docs/AnimatedAPI.gif)

## Declarative transitions and animations
[React Native Animatable](https://github.com/oblador/react-native-animatable) creates simple animations and transitions with declarative components, just import the element and choose from a lot of animations pre-build or create a custom animation! 
![](https://cloud.githubusercontent.com/assets/378279/10590307/ef73b1ba-767d-11e5-8fb9-9779d3a53a50.gif)

## Animations from Adobe After Effects
This is the most awesome library for me, [Lottie](https://github.com/lottie-react-native/lottie-react-native) parses Adobe After Effects animations exported as JSON with bodymovin and renders them natively on mobile!
![](https://github.com/lottie-react-native/lottie-react-native/raw/master/docs/gifs/Example2.gif)

## Conclusion and some mentions
I hope this list helps you, I know that this kind of content is not the most technical post that I can create, but I think that lists like that help to discover news libs or sometimes point a solution for you.
I want to mention here two libraries that I don't put on primary content, but are useful: [React Native Reanimated](https://github.com/software-mansion/react-native-reanimated) and [React native animated math](https://github.com/rastapasta/react-native-animated-math).

If you know another's animation libraries, comment here!
All the best!