Thanks Catalin for these videos. They are really awesome. I would love to see videos explaining the animation API, especially for beginners like myself.
Woo man, I love my addiction to your videos. Awesome buddy! Will you please make more videos on different types of header and footer animation which includes like parallax or sticking tab to top or scrolling at particular coordinate e.t.c
Thanks for the video. There's something off with the scrollY such that I get an error saying "Cannot read property 'length' of undefined'. :S It works when using scrollY the first time in the Animated.View but not when it's embedded inside the Animated.Text I think fundamentally, it's causing an error because the static value of topEdge and inputRange are dependent on `bottomActions` which changes based on the component rerendering. So topEdge and inputRange can't change when bottomActions changes.
Bro u r super, please make a video about little project stuff's using expo ,like how to use activity indicator using axios, bottom and top tab designs,tab bars in middle of the screen, using cameras,image picker,like in real time projects, because I u only guy in youtube to use expo effectively.
Great suggestions Naveen. I’ll think about them and see what I can come up with. Cheers ✌️
3 ปีที่แล้ว +1
This is amazing, but there's a small catch... You wouldn't be able to scroll by swiping the bottom card. One could use pointerEvents='none', but then, if you want o use a touchable component, it wont work :/. Any suggestions?
Hi Catalin If I apply bottomActions && Animated.View the bottom tab wil not be shown. And if I remove 'bottomActions &&' and leave Animated.View as is I'll get the following error: Invariant Violation: inputRange must be monotonically non-decreasing -1,0,NaN,NaN,NaN
I got the same issue. My solution; It wasn't increasing regularly because I did -1.0, Edge +1, Edge, Edge+1. I solved it by doing Edge-1 in the 3rd row. If not resolved, import Dimensions and const { width, height } = Dimensions.get("screen"); you should add. It may be having an anonymity problem. But; You can test it by typing const topEdge = 10 (or any other number) to see if the problem is here. Aynı sorunu ben de aldım. Çözümüm; -1,0, Edge +1, Edge, Edge+1 yaptığımdan dolayı düzenli artmıyordu. 3. sırada ki Edge-1 yaparak çözdüm. Eğer çözülmezse Dimensions import edip const { width, height } = Dimensions.get("screen"); eklemelisin. Tanımsızlık sorunu yaşıyor olabilir. Ama; sorunun kesin burada olup olmadığını anlamak için const topEdge = 10 (veya başka bir sayı) yazarak test edebilirsin.
awesome - can u please make a short video related to responsive design so it works with all devices from small to a large one and adopts the layout! if u also run ur example with an android 4.5-inch device or 4 inches it won't work the same.
Does anyone have an offset of stickiness position? I can't understand what is wrong, I've even tried to play with safe area's insets but it is not a problem. And on different devices it has a different value, e.g on iPhone SE that offset is more than on iPhone 12 Pro. By "offset of stickiness" I mean the case which author showed at : 15:37 In my case, it starts a bit earlier
@@CatalinMironDev thank you, it's working. But if it has touchable component with onpress, onpress not working. Used pointerEvents='box-none' also not working.
Hi Yashodeep, in order to have access to the final source code you need to become a Patreon: www.patreon.com/bePatron?u=20582060. There are many projects there and you can access the full source code once you are a Patreon. Thanks ✌️
Thanks Catalin for these videos. They are really awesome. I would love to see videos explaining the animation API, especially for beginners like myself.
thank you so much ... love from india -> tamilnadu..
I’m not a react-native or mobile app developer but watching your video is like wow 🤯. I think simplicity is making it awesome 🤔👍
Thanks a lot Mainendra ✌️
brooo, why I didn't see you before, your contents are awesome!
I love you bro, I was Iooking for exact thing to implement into my client's app. Saved a lot of time!!
I'm not a react native developer but always like to watch your videos. Just for ideas 😉. Love the way you explain the things ❤️.
Was waiting for your video 🔥
Hope you enjoyed it and sorry for not posting last week, I was kinda lazy to do it :) Thanks a lot Akshat! ✌️
@@CatalinMironDev I learn so much from your videos.. You keep me motivated ❤️
Wow, thank you Akshat ✌️
Heey man! Whatup! Im just fan of your work dude! Big thanks for all this amazing tutorials! Hello from Venezuela!
Thank you so much for sharing this with me ❤️
The article is weird thou :D
I am rewatching the series. It is awesome!
Woo man, I love my addiction to your videos. Awesome buddy! Will you please make more videos on different types of header and footer animation which includes like parallax or sticking tab to top or scrolling at particular coordinate e.t.c
That’s a great suggestion. Thanks Adarsh! ✌️
Bro, I'm from Brazil, but your lessons are so better then here
Thanks Pedro ✌️
Very useful and practical example! Thanks!
I’m glad you found them useful. Thanks Jacob ✌️
As always, awesome content 👍
I’m glad you liked it. Thanks Orfan ✌️
as usual the best content!
Thank you! ✌️
Thanks for the video. There's something off with the scrollY such that I get an error saying "Cannot read property 'length' of undefined'. :S It works when using scrollY the first time in the Animated.View but not when it's embedded inside the Animated.Text
I think fundamentally, it's causing an error because the static value of topEdge and inputRange are dependent on `bottomActions` which changes based on the component rerendering. So topEdge and inputRange can't change when bottomActions changes.
God level, like always ♥️🔥
Wow, thank you Adri ✌️
You are the bestttt😍❤️
Thank you so much Zohre ✌️
its amazing :)
Bro u r super, please make a video about little project stuff's using expo ,like how to use activity indicator using axios, bottom and top tab designs,tab bars in middle of the screen, using cameras,image picker,like in real time projects, because I u only guy in youtube to use expo effectively.
Great suggestions Naveen. I’ll think about them and see what I can come up with. Cheers ✌️
This is amazing, but there's a small catch... You wouldn't be able to scroll by swiping the bottom card. One could use pointerEvents='none', but then, if you want o use a touchable component, it wont work :/. Any suggestions?
oh dude so awesome
I’m glad that you like it. Thanks Gilmar ✌️
i like your course
Hi Catalin
If I apply bottomActions && Animated.View the bottom tab wil not be shown. And if I remove 'bottomActions &&' and leave Animated.View as is I'll get the following error:
Invariant Violation: inputRange must be monotonically non-decreasing -1,0,NaN,NaN,NaN
I got the same issue.
My solution;
It wasn't increasing regularly because I did -1.0, Edge +1, Edge, Edge+1. I solved it by doing Edge-1 in the 3rd row.
If not resolved, import Dimensions and const { width, height } = Dimensions.get("screen"); you should add. It may be having an anonymity problem. But; You can test it by typing const topEdge = 10 (or any other number) to see if the problem is here.
Aynı sorunu ben de aldım.
Çözümüm;
-1,0, Edge +1, Edge, Edge+1 yaptığımdan dolayı düzenli artmıyordu. 3. sırada ki Edge-1 yaparak çözdüm.
Eğer çözülmezse Dimensions import edip const { width, height } = Dimensions.get("screen"); eklemelisin. Tanımsızlık sorunu yaşıyor olabilir. Ama; sorunun kesin burada olup olmadığını anlamak için const topEdge = 10 (veya başka bir sayı) yazarak test edebilirsin.
I mean, I had a problem because I wrote it wrong, I meant to say that your problem may be in that part. 😅
What should we do extra to stay on the screen?
When are you making your course. 🔥
Not sure if I can do it by the end of the year. Thanks Vishwajeet ✌️
awesome - can u please make a short video related to responsive design so it works with all devices from small to a large one and adopts the layout! if u also run ur example with an android 4.5-inch device or 4 inches it won't work the same.
Unable to understand how outputRange[0,0,0 ," -1"] making it stick to red box. 🤔
The scroll y is always positive. However, we want it to translate up which is negative translateY. Hence using -1.
Does anyone have an offset of stickiness position?
I can't understand what is wrong, I've even tried to play with safe area's insets but it is not a problem.
And on different devices it has a different value, e.g on iPhone SE that offset is more than on iPhone 12 Pro.
By "offset of stickiness" I mean the case which author showed at : 15:37
In my case, it starts a bit earlier
I'm sorry - just my problem
Forgot to extract some styles from ScrollView to the parent container
can not we use a ref instead of state for storing the layoute of bottomedge ? That way it wont cause re-render
This is so so coooool 😍😍 .. If you can make a video on medium clone in your way, then it will be really really awesome .. Thank you 💜
That’s a great suggestion. Thanks Sujata ✌️
Could you please make video of combined bar chart and Line chart in react native.
Why can't I scroll from footer? I touch the footer and try to roll but it doesn't work
please , make one video for header flatlist
I did not understand outputRange:[60,60,60,0,0] for icon. Can you explain in more detail? why we gave 60 for -1 and 0.
60 for -1 is because I'd like to keep it at 60pt even if the user scroll is beyond -1 ✌️
Cool!)
I'm glad that you liked it! Thanks ✌️
hi, when will your animation course be released?
When I’ll have time. Unfortunately I can’t do it this year. Thanks nadeem! ✌️
The year is almost over. 💜
ExceptionsManager.js:179 Error: Property 'transformY' is not supported by native animated module
translateX
You should use `transform: [{ translateY }]`
Hey i really like you're video and can please implement stick header as well please
Great suggestion! I'll do it Vikil. Thanks ✌️
Please share your vscode style, the text and the theme.
Hi Mohamed, VSCode theme: Palenight, font: Operator Mono ✌️
@@CatalinMironDev thanks
i've got this error "inputRange must be monotonically non-decreasing -1,0,-796.xxx,-795.xx ......
i had the same error
Thanks.
Not able to scroll, when touching the footer
Add `pointerEvents="none"` to the footer View. Thanks Subramanian ✌️
@@CatalinMironDev thank you, it's working. But if it has touchable component with onpress, onpress not working. Used pointerEvents='box-none' also not working.
Please create a complete RN Animation Course. Please
Please make custom crop using react native. 😭😭😭😭
Actor Catalin 🤣
Thank u
You’re welcome Kahil ✌️
Drag and Sort or Drag and Drop man. Please ! I Implore you
Where is the source code
Hi Yashodeep, in order to have access to the final source code you need to become a Patreon: www.patreon.com/bePatron?u=20582060. There are many projects there and you can access the full source code once you are a Patreon. Thanks ✌️
How the hell do you type that fast omg
Gawd
Thanks Aman ✌️
i likw youercourse
💲