What's up mobile devs? This time the code to be written for the boilerplate took a little longer. Despite this, I still preferred to start the tutorial from scratch. If you want to start directly from LayoutAnimations -> 11:05
This video was incredibly helpful! I'm finally starting to understand animations in React Native. Thank you for creating such a clear and concise tutorial
Clear explanation as always. Here is a suggestion. I was struggling to find an accordion/dropdown component that has nice animation and was performant. Sometimes the dropdown has 100 elements and just animated the view by adding and removing the 100 elements was not very performant. If you could do such a tutorial that would be awesome
Thank you for this great and helpful containte , I have a suggestion for a video : selecting an item in a list with long press and change his position with swiping of course with animating the changes
Your all examples were amazing just one request please create separately display basics of all reanimated library and then may be to it's very clear for us to view all your reanimated examples
Fantastic tutorial 🎉 really good work. Good pace and covering of special cases. (There currently 2022-10 is a bug in android which cause the header from react-navigation to overlay when using the entering prop from reanimated- just sharing since it took me some time to figure out)
Could you do a tutorial to animate the layout of a flatlist with 2 columns?. I'm trying to animate it like the example shown on this video but i'm not getting it to work.
Thank you for your support... My suggestion is to make react native app that can communicate with USB devices..read and write...if it's possible..I appreciate that from you...
Hi. I just ran your code and I found out on Android, the last item of scroll view break into half and then disappear. Can you give solution to fix this ?
thank you brother 🌹 i have a small qst , im using scrollview but im getting a big lag when i use more than 4 components in the same scrollview ? is there any solution for this ?
how do you animate the item inside a Flatlist component just like when you add the item quickly in the video? I've tried using layout animation, but it turns the item to start animate together. I want the animation start from the first item and continue to the next item. any idea?
I would avoid the use of Layout Animations for this use case. Instead you can simply create an "height" SharedValue and animate it with the "withTiming" function from reanimated. I think that the video related to the "Swipe to delete gesture" can help you 👀
Last item in list behaves strangely on Android (doesn't animate when deleted, and has strange animation when moving up if you delete a prior item), do you have any ideas for that? I've Googled it but can't find an answer.
It works when you set the ScrollViews contentContainerStyle such that it contains "paddingVertical: 100", the 100 being the height of the button. it moves the list a bit down but it will at least work... Strange bug
@@chorazytorpeda16 I recently made a new video about Layout animations with v3 th-cam.com/video/NPq_MFLnQrQ/w-d-xo.htmlsi=fl1MNJvtAfKmCDgl Although you can still use this one and replace layout=Layout with layout=LinearTransition and it will work as well. Hopefully this is helpful
Well the first 11 Minutes are not about the topic at all. Maybe you should build a sample application first and show the "magic" of layout animation after a quick recap what you build before. That would save peoples time to watching you build a standard scrollview list before even starting.
What's up mobile devs?
This time the code to be written for the boilerplate took a little longer.
Despite this, I still preferred to start the tutorial from scratch. If you want to start directly from LayoutAnimations -> 11:05
You're really an amazing instructor and React Native dev. Your videos have been very helpful. Thank you.
This video was incredibly helpful! I'm finally starting to understand animations in React Native. Thank you for creating such a clear and concise tutorial
Thank you, I really appreciate the feedback :)
You videos are simply awesome and very much easy to understand. I just can't wait for your next video each time a new one comes up.
Hi Arshie, glad you liked it!
Been looking for a tutorial just like this. I couldn't click play fast enough. Thank you so much!
Hi Haley, thank you very much for your support! 🚀
React native developer digging into reanimated recently -- Genuinely enjoy your straight to the point tutorial! Keep up with your great work :)
No one has ever offered such quality content for free 🔥
Your React Native tutorials are excellent, please make more, I am building awesome things with your guidance 😎
Thank you for this awesome content
Clear explanation as always. Here is a suggestion. I was struggling to find an accordion/dropdown component that has nice animation and was performant. Sometimes the dropdown has 100 elements and just animated the view by adding and removing the 100 elements was not very performant. If you could do such a tutorial that would be awesome
We need this one
excellent as always!
Hi Diko, thanks for your continued support 😁
This is so cool! I've been looking for a long time for someone to finally explain it just like you did. Thank You!
Thank you Sarev, feel free to checkout my other videos 😁
Thank you for this great and helpful containte , I have a suggestion for a video : selecting an item in a list with long press and change his position with swiping of course with animating the changes
Awesomely explained ❤️
Take us further in this reanimated journey
Thank you very much! 🤓
Thanks mate, you helped me a lot in understanding Reanimated with your tutorial :)
Awesome content as always 💯
superb . continue .
Good job! Very nice instruction for reanimanted 2, thank you !
Your all examples were amazing just one request please create separately display basics of all reanimated library and then may be to it's very clear for us to view all your reanimated examples
Amazing content 🔥
Awesome channel !!! Keep posting react native stuff love your videos!! Also which keyboard do you use the sound is so soothing
As always amazing content 💪 It would be nice if you can make a series about making responsive and performant charts!
🔥 Just awesome 🎉🎉🎉
Great video, thanks sir😀
Fantastic tutorial 🎉 really good work. Good pace and covering of special cases.
(There currently 2022-10 is a bug in android which cause the header from react-navigation to overlay when using the entering prop from reanimated- just sharing since it took me some time to figure out)
i love it :)
subscribed
Love your videos! How about making some custom animations like collapsable header of the FlatList/SectionList.
What's the purpose of defining initialMode as a useRef() instead of a useState()?
cool man ❤️
Is it possible to change the exiting animation dynamically?
Thanks for the great content! I would like to know what theme are you using for Visual Studio.
Could you do a tutorial to animate the layout of a flatlist with 2 columns?.
I'm trying to animate it like the example shown on this video but i'm not getting it to work.
Thank you for your support...
My suggestion is to make react native app that can communicate with USB devices..read and write...if it's possible..I appreciate that from you...
Hi. I just ran your code and I found out on Android, the last item of scroll view break into half and then disappear. Can you give solution to fix this ?
Amazing
thank you brother 🌹
i have a small qst , im using scrollview but im getting a big lag when i use more than 4 components in the same scrollview ? is there any solution for this ?
it has bug when you delete bottom item of scrollview
Hmm, but the layout issue is still there. Just add more items to the list (like 15 items), scroll down and then delete some item there.
how do you animate the item inside a Flatlist component just like when you add the item quickly in the video? I've tried using layout animation, but it turns the item to start animate together. I want the animation start from the first item and continue to the next item. any idea?
What if we what to animated a component from height 0 to its desired height but without rerendering?
I would avoid the use of Layout Animations for this use case. Instead you can simply create an "height" SharedValue and animate it with the "withTiming" function from reanimated. I think that the video related to the "Swipe to delete gesture" can help you 👀
Can you do something like Collapsible/Accordion animation? That one will be very helpful. Thanks for the video btw, you're awesome!!!
Last item in list behaves strangely on Android (doesn't animate when deleted, and has strange animation when moving up if you delete a prior item), do you have any ideas for that? I've Googled it but can't find an answer.
It works when you set the ScrollViews contentContainerStyle such that it contains "paddingVertical: 100", the 100 being the height of the button. it moves the list a bit down but it will at least work... Strange bug
more animation video please 🥺
Outdated, doesnt work with v3
@@chorazytorpeda16 I recently made a new video about Layout animations with v3 th-cam.com/video/NPq_MFLnQrQ/w-d-xo.htmlsi=fl1MNJvtAfKmCDgl
Although you can still use this one and replace layout=Layout with layout=LinearTransition and it will work as well. Hopefully this is helpful
Well the first 11 Minutes are not about the topic at all. Maybe you should build a sample application first and show the "magic" of layout animation after a quick recap what you build before. That would save peoples time to watching you build a standard scrollview list before even starting.
how we could apply this behavior on a single element ? Just a div being rendered controlled by a state value. like if show = true then render
{{show &&
@@Reactiive this doesnt work :(
@@BayramArif feel free to reach me via Patreon or Twitter DMs