SVG Animations with React Native

[@clemensphilipse901]

Truly remarkable, I didn't even know that was a possibility to animate and it isn't even that much code! :D

[@rasseliodiack7159]

Can't wait to be at home to try that. Thanks again for your content William.

[@mohdsajidshaikh4291]

Your intro is very good. I see many times.. Thanks for sharing

[@pezo1919]

Hello Zürich developers, I hope you are native, react is here well from beautiful William. :D

[@enterteg]

Omg you're magician!

[@mohit23x]

at 23:21....we also like it William, great tutorial!

[@navjotsingh6930]

Loved your work. Keep it up.

[@tonystarksu8619]

when i refresh my app, there's still a little time I can see the text before it start animating from blank and i don't know why :( is it because the onLayout function fired too late?

[@steve-jobs]

> ref.current.getTotalLength is not a function. help me ㅠㅠ

[@minhtainguyen9283]

me too

[@joshreynolds4164]

Damn this was smooth!

[@lilqdh2928]

after watch your video, I think react native maybe do anything. Thank you a lot !

[@weickmamferreira3507]

Hello, I'm from Brasil🇧🇷 and I'm 13 years old. I congratulate you on the content, I have always been looking for content focused on animations, design ... More here in Brazil the content is very scarce😔. I wish you a lot of success, and that several devs in the world know you. Forgive me for my English, which is not very good.

[@jpisello]

Your English is actually very good, Weickmam.

[@weickmamferreira3507]

@@jpisello Thanks😊

[@FlowTrax]

Challenge for you! Try and animate the viewBox of the SVG element. I’ve had trouble trying to do that, the only way for me to get it working was to double the height and width of the container. I’d love to be able to animate there viewBox as that way I can retain the quality of the svg when scaling.

[@lorkfongbot4683]

William, You're a god!!

[@programmingbeasts4649]

Thank you for your content, your channel is something I enjoy, but please turn off the music because it is distracting or at least reduces the focus.

[@Ezos7]

Unfortunately this demo isn't usable due to the NPM library reanimated version rc2 being broken - reveretd to old version that works, but it's missing the "useSharedValue, withTiming" functions.

[@andylib]

Great Tutorial 🙏🏻

[@pauldubreuil7857]

How does *height = (width x vHeight) / vWidth* somehow legitimizes the path coordinates as flexible no matter what the viewport dimensions are? Wow im so pathetically confused lol

[@prakharbangar8324]

Sooo good!! Thanks.

[@mycloudvip]

Hi William, is there a way to play an mp4 video (10 sec) in loop as a background? I was able to accomplish it using expo-av but it flickers when it reaches the end of every loop. Any ideas or a better approach with Skia?

[@wcandillon]

here it is shopify.github.io/react-native-skia/docs/video/

[@mycloudvip]

​@@wcandillon Hi, the useVideo export member is not available on Skia v1.2.3, somehow that is what I have in my project. Is there a trick for force an upgrade? Thanks

[@tusharraj9785]

Awesome man👍🏻👍🏻 Need fashion series next episode 😅😅 Any date??

[@yeilmusic]

animatedProps docs?

[@KippieBudgie]

Hi @William Candillon, thanks for all the nice tutorials! I wanted to try this animation in my existing app, but it requires the hermes engine on Android. This makes my app crash on startup. Why is this engine a dependency? Browsing through the issues of the hermes project I see a lot of reports about fatal crashes. I would never use this in production at this stage.

[@DomBarker]

gah, got right to the end to find out that react-native-reanimated 2 does not work with expo. Any pointers for modifying this so that it works with reanimated 1 or the native animations?

[@shauryan23]

Does it even work anymore??? Because I'm facing some issues and its not animating its stuck.

[@AugustoAleGon]

What is the plugin that you are using to create the tsx component with one script? Awesome video you are amazing!

[@osdima1]

William, thanks for this video. Very helpful. I got a question: Is it possible to use getPointAtLenght function from Readsh with Reanimated2? I am trying to do animate a point across SVG path and I need a function to calculate the coordinates.

[@PkPankaj43]

Hello, can you give an idea how can we create color book app (like colorfy) in react native? Please reply.

[@wcandillon]

we have a video dropping tomorrow of Friday that will show a path on how to do these things in React Native. I am likely to do a video the colorfy example.

[@tsioryfitiavanaanhykrishna6992]

Hey william!what theme do you use and what font too ? BTW nice video as usual, keep up the good works!

[@willyrosahuanca696]

So cool!!

[@benichoujason]

Salut, Merci beaucoup pour toutes tes videos 🙏🏽 Dis moi pourrais tu faire une présentation des outils que tu utilises et leurs configurations ? (IDE, packages installés, etc..) Merci encore, Jason

[@mdjahidulislam9205]

I am beginner at animation. From where to start? In your channel?

[@markdoyle8918]

Nice! What font is your vscode?

[@humzajameel5487]

You are amazing.How do you learn these skills? what is your secret?

[@BeyondWithAlireza]

Whenever I stuck at doing an animation I put the you are my sunlight song

[@alexfrozen]

I think reanimated should be noticed in title.

[@viniciusclemente5119]

Congrats man, make a vídeo with simple animations transitions of left for right ...

[@ratuldas6719]

sir, make a tutorial on react spring,please

[@mixo7637]

Is awesome

[@rubandharmaraj6094]

jhonny sins of react native

[@mayawright]

YOU ARE FUCKING FITTTTTTTTTTTTTTTT MATE!

[@alvarobyrne]

nice reanimatedv2 reanimated v2 tutorial reanimated2 reanimated-v2 #reanimated

[@atif7865]

impossible to understand the accent. I am sure the content is superb though!