React Native Loading Animation - React Native Moti & Reanimated v2

Veröffentlicht am: 30 November 2021
auf dem Kanal: Catalin Miron

32,775

🔥 In this video tutorial we will create a powerful custom loading indicator using React Native Moti powered by the amazing React Native Reanimated 2 running at 60fps.

We'll go through:
How to use react native moti loop functionality
What's the difference between repeat and loop in react native moti
How important is React Native Reanimated 2
How performant is React Native Reanimated 2
How to animate width, height, borderRadius, borderWidth and shadowOpacity in React Native and still running at 60fps

-------------------------------------------------------------------------------------------------------------------------------------
⚠️ Access full source code: https://www.animatereactnative.com/po...
-------------------------------------------------------------------------------------------------------------------------------------

👉👉 Have any questions? Join Discord:   / discord  .

-------------------

Follow me on
Twitter:   / mironcatalin

Want to support me?

Patreon:   / catalinmiron
BuyMeACoffee: https://www.buymeacoffee.com/catalinm...
Paypal: https://paypal.me/catalinmiron
----

You can find me on:

Github: http://github.com/catalinmiron
Twitter:   / mironcatalin
Website: http://batman.codes

---

Timeline:
00:00 Intro
00:08 What we're going to build
00:30 What is React Native Moti
00:51 Access 50+ animation resources
01:35 Jumping into VSCode
02:15 Style the loading indicator component
02:50 Apply Glowing effect
03:09 Loop, Repeat and RepeatReverse in react native moti
04:50 Breathing animation
05:40 Change the transition of the component
06:15 Repeat the animation
06:47 Repeat Infinity aka loop: true
07:10 What is repeatReverse
07:40 Output of repeatReverse
08:15 Animate more
09:04 Animation performance and running at 60fps
10:00 Final words about react native moti

#reactnative #reanimated2 #moti #react-native-moti #react-native-reanimated #custom-loading-indicator #react-native-animations #react-native-loop #react-native-repeat

Auf dieser Seite können Sie das Online-Video React Native Loading Animation - React Native Moti & Reanimated v2 mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Catalin Miron 30 November 2021 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 32,775 Mal angesehen und es wurde von 1 tausend den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!