Jump to content
Search Community

React Native Support

Nirmal test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi and welcome to the GreenSock forums.

 

Unfortunately, as far as I know, GSAP can't be used in React Native, due to the way RN actually works.  Keep in mind that RN works in a different way than Cordova, PhoneGap and other tools.

 

What I know is that RN uses the Animated API, which jumps directly on the native way for creating animatios. GSAP uses the browser's  requestAnimationFrame event to create the animations. Now take this with a grain of salt, because my knowledge lays on the web side of React and not in RN. Although I made a google search for RN animations with JS libraries and there weren't a lot of results.

 

Perhaps you could try going to Reactiflux and go into their discord channel and ask around for animations using an external framework:

 

https://www.reactiflux.com/

 

Sorry that I can't be more helpful, but it seems that for the foreseeable future just the existent APIs are the ones you'll have to work with. Other options involve using C, JAVA or Swift, like Flutter.

 

Then there's Lottie that allows to export After Effects animations but that's a  completely different scenario.

 

Happy Tweening!!!

  • Like 7
Link to comment
Share on other sites

  • 1 month later...

In my research, I found a fork of GSAP that works with React Native: https://github.com/skevy/react-native-gsap-demo. 

It's not tested or vetted beyond very simple tweens, but it would be really neat to see Greensock officially support native implementations. I love using GSAP on the web, and it would be amazing to be able to use it with Native Applications as well. :)

Link to comment
Share on other sites

  • 4 months later...
  • 2 weeks later...

Here I leave a repo in GitHub with a React Native demo app and some explanation about how to implement the plugin in your project. The performance using Direct Manipulation is really good, specially when compile our apps in a release version.

 

https://github.com/tufik2/TweenMaxRN

 

Video: https://www.dropbox.com/s/ioghw2t7ua5agpn/video.mp4?dl=0

 

tweenmaxRN.gif

 

 

  • Like 3
Link to comment
Share on other sites

  • 1 year later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...