React Native Tutorial #18 - React Navigation - Tab Navigator - Material Tab at Bottom &Top

[@mashschool]

If you have any questions about this or request tutorials in this style, be sure to leave a comment below, and thank you for liking the video. 😉

[@RoshanTamilsellvan]

I'm already on this for three days and going strong! Thank you Mash, you rock!

[@mashschool]

Great job!

[@dhawalpatil7779]

one of the best course

[@faithappoh]

Awesome tutorial on navigation

[@sanilkp6180]

Thank you very much!

[@dennisgonzales9521]

Awesome stuff!

[@southredmondtoxik1885]

One of the best react native teacher♥️

[@sandeepmaurya5262]

I agree

[@naveenchandar5819]

It helps me a lot.Thank you Mash for this wonderful explanation.

[@mashschool]

Glad it was helpful!

[@mahmoudjameel9136]

Awesome bro < but I need ask about I need padding top in header to material-top-tabs Because I have problem in header not show please

[@muhammadhamzaqadri1548]

when there is a new features is added in react native so please make a such wonderful videos for us on that topic.

[@mashschool]

Great idea, thank you.

[@muhammadhamzaqadri1548]

thanks alot. you are so a talented and amazing teacher. when will the remaining videos will be uppload?

[@mashschool]

You're very welcome! Working on it.

[@priyankakugapriya6741]

Thank you for the great video. Will this method be applicable for react native for windows as well?

[@mashschool]

Yes you can use this module in RNW. In this link you can find the list of supported modules: microsoft.github.io/react-native-windows/docs/supported-community-modules

[@cinimodmil]

Hello Mash! Really great series! Is there any way to introduce a tab bar badge for material top tab navigator? Been trying to google for it but everything just shows bottom tabs.

[@mashschool]

This issue is still open in RN repo! github.com/react-navigation/react-navigation/issues/8744 You can use react-native-tab-view module for that.

[@bennett8867]

thanks bro

[@mashschool]

Welcome

[@xyunsx]

🌹

[@a22511234]

Thank you for the great video. But I have a problem when i reload program and using TopTabNavigator, my emulator shows this problem "If you want to use Reanimated 2 then go through our installation steps" how to solve it ? thank for your helping

[@mashschool]

Make sure you have installed all dependencies mentioned here: reactnavigation.org/docs/getting-started/

[@vishalyadav8789]

sir how can we add tabBarBadge in MaterialTop Tabs Navigation for notifications count V-6.x

[@ozilog9105]

Thank you for the awesome video. I have learned so much from you. Please make a small app for us all to Learn better

[@mashschool]

At the end of this series, I'll prepare a small app in a few sessions.

[@realtorBG]

is it the same this video for EXPO as well

[@mashschool]

Yes, you just need to install the RN Expo dependencies. reactnavigation.org/docs/getting-started/

[@ahmadalastal5303]

I don't have android folder !, I am running the expo project not the CLI one, any help ?

[@mashschool]

If you have created your project with expo, you don't need an android folder.

[@ahmadalastal5303]

@@mashschool Awesome, Thanks man

[@subhashkiran7384]

Hi, Can you please tell us how to hide MaterialBottomTabs in particular screen?

[@mashschool]

You should use nested stack navigator like this: reactnavigation.org/docs/hiding-tabbar-in-screens/

[@subhashkiran7384]

@@mashschool its not working for MaterialBottomTabs, but it will work for BottomTabs

[@leongvincent9294]

Thank you and appreciate all your great lectures. Please make a simple app when you can like an Instagram where user post fill a little form and then it displays in a card component on activity feed. 🙏🏻

[@mashschool]

In the next series, I'll build a larger app like Instagram from beginning to end.

[@abdallahjabermohamad3147]

wow

[@gadhirajuvaraprasad4578]

how can i use both top and bottom tabs together?

[@mashschool]

You can use them nested. Something like this: stackoverflow.com/questions/63996844/react-native-combine-bottomtab-with-toptab

[@ReconCadre]

@@mashschool I am getting Navigators cant be nested

[@subhashkiran7384]

For ios, the screen is covered with top notch. how to add top tabs below notch display.

[@mashschool]

You can use SafeAreaView component. reactnative.dev/docs/safeareaview

[@petslover4306]

Thank you for the great video .