More powerful alternative to Animated library for React Native.
React Native Reanimated is a robust alternative to the standard Animated library, designed specifically for enhancing animations in React Native applications. This npm package, meticulously developed by Software Mansion, offers a more powerful and flexible solution for handling complex animations. By utilizing JavaScript along with native capabilities, React Native Reanimated provides a smoother and more efficient animation experience that is crucial for creating dynamic and responsive user interfaces. Its ability to run animations on the UI thread without crossing the bridge into JavaScript thread ensures that animations remain smooth even when the JavaScript thread is busy, making it a superior choice for performance-sensitive applications.
To integrate React Native Reanimated into your project, simply execute the "npm install react-native-reanimated" command in your project's root directory. This straightforward installation process adds the library to your React Native environment, allowing you to immediately begin enhancing your application with high-performance animations. React Native Reanimated supports declarative animations and gesture-based interactions, which are essential for modern mobile apps that prioritize user experience and interface fluidity. The library's extensive API also supports backward compatibility with the original Animated API, providing a seamless transition and easy adoption for existing projects that require improved animation capabilities.
React Native Reanimated is continuously updated to support the latest versions of React Native, ensuring developers have access to the most cutting-edge tools for animation development. Its commitment to performance optimization and enhancing the visual appeal of mobile applications makes it an invaluable asset for developers looking to push the boundaries of what's possible with React Native animations. Whether you're building a new app or upgrading an existing one, React Native Reanimated is the go-to solution for implementing high-quality, smooth animations that can transform user interaction and engagement.
Experimental implementation of a new declarative API for gesture handling in...
Read moreCore dependencies of this npm package and its dev dependencies.
@babel/plugin-transform-arrow-functions, @babel/plugin-transform-nullish-coalescing-operator, @babel/plugin-transform-optional-chaining, @babel/plugin-transform-shorthand-properties, @babel/plugin-transform-template-literals, @babel/preset-typescript, convert-source-map, invariant, @babel/cli, @babel/core, @babel/preset-env, @babel/types, @react-native/babel-preset, @react-native/eslint-config, @react-native/metro-config, @react-native/typescript-config, @testing-library/jest-native, @testing-library/react-hooks, @testing-library/react-native, @types/babel__core, @types/babel__generator, @types/babel__traverse, @types/convert-source-map, @types/invariant, @types/jest, @types/node, @types/react, @types/react-test-renderer, @typescript-eslint/eslint-plugin, @typescript-eslint/parser, @typescript-eslint/rule-tester, axios, babel-eslint, babel-jest, babel-plugin-module-resolver, clang-format, code-tag, cspell, eslint, eslint-config-prettier, eslint-config-standard, eslint-import-resolver-babel-module, eslint-plugin-import, eslint-plugin-jest, eslint-plugin-n, eslint-plugin-no-inline-styles, eslint-plugin-promise, eslint-plugin-react-hooks, eslint-plugin-standard, eslint-plugin-tsdoc, husky, jest, lint-staged, madge, prettier, react, react-native, react-native-builder-bob, react-native-gesture-handler, react-native-web, react-test-renderer, shelljs, ts-prune, typescript
A README file for the react-native-reanimated code repository. View Code
Reanimated 3 is here! Check out our documentation page for more information
React Native Reanimated provides a more comprehensive, low level abstraction for the Animated library API to be built on top of and hence allow for much greater flexibility especially when it comes to gesture based interactions.
Check out the installation section of our docs for the detailed installation instructions.
To learn how to use react-native-reanimated
with Fabric architecture, head over to Fabric README. Instructions on how to run Fabric Example within this repo can be found in the FabricExample README.
Check out our dedicated documentation page for info about this library, API reference and more: https://docs.swmansion.com/react-native-reanimated/
The source code for the example (showcase) app is under the Example/
directory.
If you want to play with the API but don't feel like trying it on a real app, you can run the example project. Check Example/ directory README for installation instructions.
Reanimated library is licensed under The MIT License.
This project has been built and is maintained thanks to the support from Shopify, Expo.io and Software Mansion
Join the Software Mansion Community Discord to chat about Reanimated or other Software Mansion libraries.
Since 2012 Software Mansion is a software agency with experience in building web and mobile apps. We are Core React Native Contributors and experts in dealing with all kinds of React Native issues. We can help you build your next dream product – Hire us.