Yeah, I have used animatable to make it easy. react native reanimated is also a good lib for animation. I have used in other tutorials. can check it out: th-cam.com/video/Bs4DQjWSkf0/w-d-xo.html thanks!
I would recommend reanimated 3 because you can use a SharedValue and interpolate to adjust without the need for a useEffect hook, and it will run on the UI thread.
Hi , thanks for your great videos , good job you are doing , I ve implemented your bottom tab nav animation , its working but there is an issue , when I am navigating from main / the parent screen to a child screen , the animation behavior remains there , how to unfocus the event when navigating to others screens ? Thank you
Hi @Samran, Glad you like it. Give me some more details so I can figure out the issue, mean where is the parent and child navigation, or send navigation code here.
I know it's been 4 months, but here is the answer for others who might face with same problem: You guys probably sent the focus parameter like this: tabBarIcon: ( focused ) => (........). You should've deconstruct the focused parameter like this tabBarIcon: ({ focused }) => (........). Else, your focus parameter will have all 3 usable tabBarIcon parameters (focused, size, color).
Great video, everything is working well but how do I solve the problem of when the app loads initially the bottom tab buttons (the circles) all render above the bottom tab and after a sec (or maybe less) they move down to their normal position
For that you need to add icon config in your app/build.gradle file in case of android and for ios need to add them in info.plist file or in resources/bundle resources. Checkout the vector icons configuration doc you will find the solution.
Great content bro, really helpful for me, Thank you so much for the valuable content!
This is a very good tutorial and very helpful for me
adam adam, adamın dibi. eline sağlık bro. thx so much
Glad!!
Bro, amazing work... Thank you so much!
Enjoy, cheers!
hey guy, thank you so much
This video its awesome, thanks, here from brazil
Glad you like it!
😆😆
Awsm brother 💥
Thanks!!
Awesome work vishal, Very helpful.
Showwww my friend, thank you very much, success for you and I'm already written, congratulations
Thank you! Cheers!
Great video and it was well explained... Thanks
gracias desde Mexico
Glad you like it!!
Awesome work man
Thanks a ton!
Why do you prefer react native animatable instead of react native reanimated?
Awesome video, thank you very much for the content. Keep going!
Yeah, I have used animatable to make it easy.
react native reanimated is also a good lib for animation. I have used in other tutorials.
can check it out: th-cam.com/video/Bs4DQjWSkf0/w-d-xo.html
thanks!
I would recommend reanimated 3 because you can use a SharedValue and interpolate to adjust without the need for a useEffect hook, and it will run on the UI thread.
This is awesome, but can u make animation using reanimated. I am using animatble to, but sometimes its lag.
Yeah sure, I will try, btw animatable work out of the box.
Marvelous. Could you please add typescript branch at repository?
Sure, will update it.
That's awesome 😍
Glad you think so!😊
Hi , thanks for your great videos , good job you are doing , I ve implemented your bottom tab nav animation , its working but there is an issue , when I am navigating from main / the parent screen to a child screen , the animation behavior remains there , how to unfocus the event when navigating to others screens ? Thank you
Hi @Samran, Glad you like it.
Give me some more details so I can figure out the issue,
mean where is the parent and child navigation, or send navigation code here.
I know it's been 4 months, but here is the answer for others who might face with same problem: You guys probably sent the focus parameter like this: tabBarIcon: ( focused ) => (........). You should've deconstruct the focused parameter like this tabBarIcon: ({ focused }) => (........). Else, your focus parameter will have all 3 usable tabBarIcon parameters (focused, size, color).
Good video brother. How get icons
Please make tab 2 ASAP
Thank you
Video Uploaded, checkout the playlist or tab1 description
Great video, everything is working well but how do I solve the problem of when the app loads initially the bottom tab buttons (the circles) all render above the bottom tab and after a sec (or maybe less) they move down to their normal position
For that you can initially hide bottom tab then after half a sec show it, and you can achieve this from navigation property.
apart from good content you have hear, please provide the name of the soundtrack used; very motivational
You can checkout the description, all the details below of description.
it works on expo?
Yes
Bhai PLZZ make react native resso clone or telegram in hindi
Yes I'll.
What is the background music
Sunset n Beachz - Ofshane
Please Help screen ki background ka color kaise change kara
Bro I have provided the code, you can check the Github repo.
You skipped alot of important steps that would make newbies stuck.
You should have started with a new fresh project
Will do so!
Bro, how do we implement dynamic icons inside bottom tabs based on API response.Any help !
Just replace that static TabArr with dynamic array or construct one with your api response.
bro close this song please
Please give me color screen.js and icons file source code
github.com/vishalpwr/react-native-ui/blob/master/src/screens/ColorScreen.js
BTW you can check the description and get the source code link from it.
i am unable to change icons , i see only question marks
For that you need to add icon config in your app/build.gradle file in case of android and for ios need to add them in info.plist file or in resources/bundle resources.
Checkout the vector icons configuration doc you will find the solution.
where is the code??
Here it is -> github.com/vishalpwr/react-native-ui/tree/master/src/bottomTab