Custom Bottom Tab Navigator in React Native | React Navigation v5 Tutorial 

NOTE: - In Tab.Navigator change: "tabBarOptions" => "screenOptions" - To style Tab.Navigator use: screenOptions={{tabBarStyle: {postion: "absolute",},}}

Very nice tutorial!! No fixings, clear speech.. Make more react-native tutorials please :))

V5 => V6 tabBarOptions = screenOptions/options showLabel = tabBarShowLabel headerShown: false

THANK YOU!! I'm working on my first project and really struggled to understand the docs. This is a great walkthrough. Thanks again!!!

This was a great tutorial, thanks @Pradip. As others have said, your style is refreshing. It's to the point without a lot of fanfare, just what is needed, keep up the good work!

Hi . First of all Thankyou for information and next one question tabbaroptions is not work in my react native file ? please answer the questions

Your video is very easy to understand slow and steady..... As a beginner can learn and understand easily.. Thanks.. Can you post full course video for developers in "React Native CLI" end to end all concepts... Waiting.

there is a bug for middle tab bar, onpress in top half cannot be click. the problem is from RN itself, overflow component from it's parent cannot accomodate onpress but visibility only Mr. Pradip in 13:45 was not demonstrated press in top half. sooo, is there anyone have a solution for that issue?

Bro this music is awesome, finally not a dull tutorial

Thank you so much! I was having trouble finding a tutorial that uses the react native cli instead of expo.

Please keep making RN tutorials. I genuinely enjoy them.

thanks a lot for the tutorial. How would you have the post button dissapear when focused?

I was stressing about why theres this extra frame or box underneath my bottom navigation. Then it disappeared when I added the property and value " position: 'absolute' " as I was following along your video. Thank you!

After many tutorials, you saved me! Thank you!!

Thank you very much for the tutorial Pradip, wonderful work.

Parabéns amigo, ótimo tutorial!

First of all, thank you for your video. I encountered an error, my buttons do not appear, can you help me how to fix this?

Feeling safe when you start playing video and hear the accent:)

Very good video and explanation, tried above example but plus icon not display in center or second tab only display red color circle. what am I missing?

first great tutorial I see without Expo,

More React Native tutorials please, love your videos

I have used this, but i con't change background color of bottom bat bar. I have follow your style.

You are the best! Really. No empty words! Strike to the point! Thank you

Thank you so much for your video, this is great, highly appreciated, kindly combine other navigations in one single app please

Great video. Elaborate and to the point. Keep up the good work!

Good tutorial. Could you repeat for Navigation v6 from scratch and creating different screens to show what imports are necessary? Great thanks👌

Incredible tutorial, how did you do the animation at the beginning of the video?

Excellent tutorial as usual. Keep up with the good work!

Very informative. Always looking forward to your tutorials.

Where and how can I download / get this .png images you are using as icons. Kindly let me know.

You're really good bro. Learnt some thing new today. Cheers.

Hello Thanks for this tutorial. Unfortunately this does not work when the bottom tab navigator is inside drawer navigator

Can you please let me know if there's a way to insert a hamburger menu inside bottom tab navigator?

This is a outdated. For new tab navigation. Use screen options and set those tab option values under a key in screen options called tab bar style. Also set tabbarshown as false still under screenoptions to hide the tab labels

Really cool custom bar!

How would you go about doing this to show on many screens that are not in the navbar?

Thanks!, This inspires me for my next project

This is very helpful! thank you very much

Unfortunately, on the central button, you can't click on the part that protrudes from the menu (the upper part of the button) :/

Thank you from Türkiye!

Perfect...thanks man!

Hey man! Thanks for sharing and for showing your package.json!!!!

Hey thanks it's was helpful but after build the apk size became 125 mb. How to reduce it, as I have only added bottom nav bar till now.

Really fantastic explanation.

Bro Pradeep your content is really good, but if you could provide the starter code template and the assets folder it would be great.

this tutorial is easy to understand. Great job.

Hello, Pradip first of all excellent tutorials, I wish you could do a tutorial with gallium, because there is practically nothing on the web. Thank you very much

How you deal if some content on the active page will be behind the Navigator ?

Amazing Video! Can you please tell me how you made the intro? thanks

Very helpful tutorial. Thanks!

very good tutorial... now navigation version 6 has also come, you can create videos on version 6

good lesson. very easy and without water

Post full course video about React Native CLI

Great Tutorial!

hey my friend your tutorial is very good , many thanks to you it will be a big help to my project

Thanks, how we can make a fab in bottom nav?

great video man . Actually my problem.

good tutorial! thank you

That's really use and something different and its appreciable but i really really want you to please add the UI like Flipkart if we press middle button .. if possible please take the look of Flipkart app and in that if we press middle button it opens a popup like structure ...

Great!!! This is a really good and working tutorial ... Always Thank you

when you put backgroundColor as black or dark, there is white line at the top or tab bar, becareful to use that

Help me so much, thank you.

Excelent work!!! thank you!

Thank you very much for this great video it helps me a lot

Waiting for your chat with firebase 🔥 2nd part btw Great video as always

Hi Pradip, I have been following your videos, helped me a lot. Is it possible to make a detailed tutorial on react-native-track-player, explaining all the features. Thank you.

how can i do that in MaterialTopTabs, i use this becoz bottomTab dont have swipEnable tab. Pls anwser me tks

im having trouble with position:"absolute", since it was position "absolute", the bottom tab component bury the content behind, is there anyway to get around this without defining the height 1 by 1 on each page?

thanks for the great content ❤️

Hi Pradip Debnath , may I know where you get the source code in your App.js ?

Thank you. Any idea why on android the top part of the button is not clickable ?

Great tutorial

U r great keep posting like this video 👍👍👍👍 , much appreciated sir

Sir Kindly make React native series from basic to advance.

How to navigate another child screen from any Tab screen. Let's say Home is a Tab and I want to navigate from Home component to Detail screen?

Awesome tutorial

Thanks for the tutorial! Could not find this anywhere, it would help if you would put the code somewhere too :)

Can we create Same tab navigation like RU-vid app? Means Present view on click on + button and keep existing top screen as it is.

I did this and there is a problem when we hide the navigation: it will still show a bit and not hide fully because we elevate the navBar from the bottom edge of the screen. Anybody know a work around to this?

You are awesome mate

thankyou for the content :)

thank you my friend from prindavan, i love you your tutorial help me a lot from my hell assignments

Sir apne ye code github pe push kiya h ky????????

Very nice video, where can i find those icons?

What if we do not want to display the entire Navigation Tab Bar in a particular screen, how do we make that happen?

Nice tutorial!

very good content, thank you brother

Well explained thanks!

Thank you my friend!

Hello, nice video! Congrats! do you have the repo of this code? thansk a lot

Nice! well done

Amazing dude,,, you are diamond

The button is not fully functional. The overlapping part of the button above the bottom tab navigator does not register the onPress event.

THANK YOU SO MUCH!!!!!

good tutorial and good explanation , use ..... screenOption insted of tabBarOptions.

Great video bro

Nice the lesson, more videos similar to this!

Hello sir, i hope you should give more link to dow lib in construction

Nice tutorial sooo informative sir Thanks for your efforts, Sir can you provide source code of this bottom navigation?

i am facing problem that icon on custom button does not show.. but when i remove custom button it appears.. can you help me