This was really really helpful. Trying to add background color for the active drawer item for the last 2 hours, tried everything, at last this video saved me.
Excellent tutorial even though I am learning React and although I am also learning English, it is very intuitive, excellent person, thank you, greetings from Colombia
This was super helpful! The documentation for the DrawerContentScrollView and DrawerItemList makes it hard to visualise what is happening but this cleared everything up and I was able to build the drawer menu I had designed. Thanks!
Hi, thanks for your tutorial, it was very helpful. I have a solution for DrawerItem customization for active screens at 14:39. The reason is because its active attributes depends on focused prop which is false by default, you can control this with the onPress event and a local state. For those who have problems with margin between icon and label it can't be solved because the custom styles are overridden, the same for distance between DrawerItems.
Any chance we can get a redux course where we store users data and all info in the store Or let’s work on a full project from start to end (might be hectic but will love such 🤲🏾🙏)
Check out this React Native Tutorial In Hindi - 2022: ua-cam.com/play/PLvN7nvnjkvpQribRyQ4r0FYZxKsPLGciy.html Pikashow App Clone React Native In Hindi - 2022: ua-cam.com/play/PLvN7nvnjkvpRoniWuJoj2gF3bpvHgrzoX.html
I'm using Typescript, and in custom drawer I'm using props of type DrawerContentComponentProps, but when I put the component in contentDrawer I get blank white screen, is there a solution?
Hello community, I'm facing a problem implementing React Navigation. Here is my scenario: I am implementing two navigations simultaneously: Drawer as the main navigation. Stack navigation. There are some screens that are present in both of my navigations, and this is where my code starts to trouble me. I am not able to access screens from both navigations. Can anyone assist me with this?
Hi , I got one error and error is ERROR Invariant violation requireNativeComponent :"RNSScreen" was not found in the UIManager. How to fix this error ?
i do the same as you do but still it shows an error Error: Couldn't register the navigator. Have you wrapped your app with 'NavigationContainer'? please tell me
Dear sir invariant react-native modulation app registry eroor is coming when I install and implement drawer navigator when I check this error on StackOverflow its showing react native reanimated 2 need install but I also follow those step but my problem still not going
Is there a way to disable menu items and grey them out ? I don't mean making them invisible by wrapping the screen with a {shouldBeVisible && ...}. I mean just greying it would and making it not clickable. Right now I am using slight of hand by wrapping the screen in said if statement and using grey text in a custom drawer component. But it would be great if there was a isDisabled property for each screen that you could toggle using context or something like that.
Sir mere menu icons colourful hai but black mai aa rhe hain, unko original colour mai show krne k liye konsa code likhna pdega aur kis jagah par likhna pdega
Hey, great tutorial indeed. Question: what if I want a button on the right oh the header bar ( not in the drawer) to open a modal window.. how can I add it?
Sir I really enjoyed your lesson it is really informative, but the question I have is, how can I add a drop-down sub-menu to one of the drawer screens?
How to remove the margin around drawerItems? I want to take the whole space. So is there any way to either remove the margin or style the whole thing (drawerItem + margin around it).
Hi bro, am facing an issue in the drawer navigation , can u pls help me with it? I've followed the steps as said, but getting this error ======= Error: Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin?, js engine: hermes
Thanks for the tutorial, nice one. I have a problem building the app because am using RN 0.69 and got an error "library "libfolly_json.so" not found", kindly help.
I've been scratching my head since ysetarday; everything worked so far till I installed drawer, then the app fails to compile, wiht Error: Requiring module "node_modules eact-native-reanimated\src\Animated.js", which threw an exception: TypeError: undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions')
@@thiranhetti , Hi buddy, Yes I did, via the docs reactnavigation.org/docs/drawer-navigator#installation but here is how: make sure import this at the root index.js; import 'react-native-gesture-handler' More importantly: add this to the babel.config.js : module.exports = { plugins: [ 'react-native-reanimated/plugin', // this should be listed last ], }; for Android, 1: Turn on Hermes engine by editing android/app/build.gradle like this: project.ext.react = [ enableHermes: true //
how do I navigate to a different screen from within the custom drawer. for example when you click the profile image in the custom drawer? I tried importing use navigation and doing navigation.navigate.. but it does not work.
If I download the source code and just install all the dependencies, will this app work on my computer? saving my hours of all this silly errors I keep getting every second
It is mentioned briefly in the video but you can use the DrawerItem component. You will be able to style each item then. reactnavigation.org/docs/drawer-navigator/#providing-a-custom-drawercontent
Thanks a ton! your repository is awesome ! Please rename it to react native boilerplate because it gives a quick jump to development phase, people spend a lot of time in setting up drawer and navigation stack which your repository is saving
Hi bro, first time run hone par ye error aa raha hai. -- TypeError: navigation.openDrawer is not a function. (In 'navigation.openDrawer()', 'navigation.openDrawer' is undefined). but second time phirse run karta hu to problem nhi ata drawer thik se open hota hai. what is actual issue any idea?
ERROR TypeError: Cannot read property 'style' of undefined, js engine: hermes ERROR Invariant Violation: "main" has not been registered. This can happen if: * Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project. * A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called., js engine: hermes
TypeError: undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions') ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native. ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native. ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.
I was searching for this online and the manuals are not very handy. Then stumbled upon this video! So clear and so nice explanation! Thanks mate!
This was really really helpful. Trying to add background color for the active drawer item for the last 2 hours, tried everything, at last this video saved me.
Excellent tutorial even though I am learning React and although I am also learning English, it is very intuitive, excellent person, thank you, greetings from Colombia
This was super helpful! The documentation for the DrawerContentScrollView and DrawerItemList makes it hard to visualise what is happening but this cleared everything up and I was able to build the drawer menu I had designed. Thanks!
Thanks. I'm glad that it was helpful.
How to add drop down in react navigation drawer. This video was very informative.
Thank You So much, your video help me to create custom drawer easily.
Excellent tutorial for the beginners to get the concept
Hi, thanks for your tutorial, it was very helpful. I have a solution for DrawerItem customization for active screens at 14:39. The reason is because its active attributes depends on focused prop which is false by default, you can control this with the onPress event and a local state. For those who have problems with margin between icon and label it can't be solved because the custom styles are overridden, the same for distance between DrawerItems.
Great content! Really helped me grab RN6 custom drawer concept easily. 👍
Thank you so much! very useful tutorial it's really helpful, good luck Sir.
again - thank you! These videos are awesome
Love this tutorial. Thank you.
thanks it was really helpful
Thank you for such informative tutorials
Any chance we can get a redux course where we store users data and all info in the store
Or let’s work on a full project from start to end (might be hectic but will love such 🤲🏾🙏)
Bro please make complete course and one project
Yes really need it
Check out this
React Native Tutorial In Hindi - 2022: ua-cam.com/play/PLvN7nvnjkvpQribRyQ4r0FYZxKsPLGciy.html
Pikashow App Clone React Native In Hindi - 2022: ua-cam.com/play/PLvN7nvnjkvpRoniWuJoj2gF3bpvHgrzoX.html
Great Explanation bro... You really saved me 🙌🙌
That was awesome!
Amazing tutorial bro
Thanks brother! 🙂
thanks man , you are doing great job
Really Really Really good job
Thank you so much , Really Helpful Video
I'm using Typescript, and in custom drawer I'm using props of type DrawerContentComponentProps, but when I put the component in contentDrawer I get blank white screen, is there a solution?
Your videos are great but the background music is so stressful (especially when the reading speed is over 1.5).
thanks a lot for your efforts
you saved my day. Thank you. Can you do a video about User registration and Login using Firebase?
thanks for your efforts, but please reduce the music or disable it in order for us to focus on your great content.
Exactly what I needed sir, thank you 🤲
Legend...Great video!!
do you have idea if i want make drawerContent in class component because it never use props
as this way
it was so helpful thank you so much
Nice tutorial
Thank you! Cheers!
Best tutorial
thanks!!!Your videos are awesome!!!!
Thanks for this great video, it was very helpful!
amazing bro. i like your videos
Great Explaination! Thanks for this video ..
Awesome tutorial
This was very helpful thanks a lot sir!
Hello community,
I'm facing a problem implementing React Navigation. Here is my scenario:
I am implementing two navigations simultaneously:
Drawer as the main navigation.
Stack navigation.
There are some screens that are present in both of my navigations, and this is where my code starts to trouble me. I am not able to access screens from both navigations.
Can anyone assist me with this?
at the moment you are perfect...may be to implement Firebase V9 will be very kind of you
Thank you for your suggestion
@@itzpradip discord group
Thanks a ton! In case I need to show hamburger icon and custom with other icon, how I can do that?
On my drawer items there is ripple effect when touch, but I don't see this in yours... is there a way to remove it?
My Man. Thanks a lot.
Very helpful!
Thank you bro, you saved me!!
Hi ,
I got one error and error is
ERROR Invariant violation requireNativeComponent :"RNSScreen" was not found in the UIManager.
How to fix this error ?
Awesome 👍👍 video
How did you do the introduction demo video of the app mockup
i do the same as you do but still it shows an error Error: Couldn't register the navigator. Have you wrapped your app with 'NavigationContainer'? please tell me
Dear sir invariant react-native modulation app registry eroor is coming when I install and implement drawer navigator when I check this error on StackOverflow its showing react native reanimated 2 need install but I also follow those step but my problem still not going
Wow!👍👍👍 Thank you!
my drawer overlays the previous screen instead of pushing it, how can i configure this behavior ?
Is there a way to disable menu items and grey them out ? I don't mean making them invisible by wrapping the screen with a {shouldBeVisible && ...}. I mean just greying it would and making it not clickable. Right now I am using slight of hand by wrapping the screen in said if statement and using grey text in a custom drawer component. But it would be great if there was a isDisabled property for each screen that you could toggle using context or something like that.
Sir mere menu icons colourful hai but black mai aa rhe hain, unko original colour mai show krne k liye konsa code likhna pdega aur kis jagah par likhna pdega
Hey, great tutorial indeed. Question: what if I want a button on the right oh the header bar ( not in the drawer) to open a modal window.. how can I add it?
Sir I really enjoyed your lesson it is really informative, but the question I have is, how can I add a drop-down sub-menu to one of the drawer screens?
Tks for share man!
How do you config google fonts globally in your project?
How do we get nesting navigation like a onboard screen and a home screen with navigation.replace() funtion
How to add border below side drawer categories name? and one more picture?
As you said at 15:00 this props will not working for drawer item but why?
How to remove the margin around drawerItems? I want to take the whole space. So is there any way to either remove the margin or style the whole thing (drawerItem + margin around it).
Hi bro, am facing an issue in the drawer navigation , can u pls help me with it? I've followed the steps as said, but getting this error
=======
Error: Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin?, js engine: hermes
I know how to fix this.
@@jomaraggabao7877 how?
@@jomaraggabao7877 please tell me how? :((((
I have error: Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin?
Thanks for the tutorial, nice one. I have a problem building the app because am using RN 0.69 and got an error "library "libfolly_json.so" not found", kindly help.
I've been scratching my head since ysetarday; everything worked so far till I installed drawer, then the app fails to compile,
wiht Error: Requiring module "node_modules
eact-native-reanimated\src\Animated.js", which threw an exception: TypeError: undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions')
Hey did you figure out?? I'm having the same issue
@@thiranhetti , Hi buddy, Yes I did, via the docs reactnavigation.org/docs/drawer-navigator#installation
but here is how:
make sure import this at the root index.js; import 'react-native-gesture-handler'
More importantly:
add this to the babel.config.js : module.exports = {
plugins: [
'react-native-reanimated/plugin', // this should be listed last
],
};
for Android,
1: Turn on Hermes engine by editing android/app/build.gradle
like this:
project.ext.react = [
enableHermes: true //
Thanks man, upload this to stack you'll get a ton of reputations😘
@@thiranhetti, thanks man.
Glad I can help :)
@@thiranhetti You did ask there!?
please make a video on how to create a sub menu on react native navigation drawer
Cannot find module 'babel-plugin-r'
how do I navigate to a different screen from within the custom drawer. for example when you click the profile image in the custom drawer?
I tried importing use navigation and doing navigation.navigate.. but it does not work.
Make sure you have imported the libraries correctly
ionicons are showing on iOS.. plz help me
does anyone know how to hide a bottom tab navigation from showing inside the drawer?
If I download the source code and just install all the dependencies, will this app work on my computer? saving my hours of all this silly errors I keep getting every second
thanks brow
i'm facing some issues with drawer navigation
Sir yeh error arha ha
TypeError: navigation.openDrawer is not a function. (In 'navigation.openDrawer()', 'navigation.openDrawer' is undefined)
How do I separate the DraweItemList? I wanna make a line separating the list in 2 groups but using I only get the whole list
It is mentioned briefly in the video but you can use the DrawerItem component. You will be able to style each item then.
reactnavigation.org/docs/drawer-navigator/#providing-a-custom-drawercontent
nice one
bro navigation drawer not working for mee plz help mee bro
Does this navigation could be combined with tab navigator?
Yes
Thanks a ton! your repository is awesome ! Please rename it to react native boilerplate because it gives a quick jump to development phase, people spend a lot of time in setting up drawer and navigation stack which your repository is saving
I'm glad that you think so. Thanks for your Comment & suggestion.
how to set drawer in bottom tabs
undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions')
Getting this error .. anyone help please :(
Same here
Hi bro,
first time run hone par ye error aa raha hai.
-- TypeError: navigation.openDrawer is not a function. (In 'navigation.openDrawer()', 'navigation.openDrawer' is undefined).
but second time phirse run karta hu to problem nhi ata drawer thik se open hota hai.
what is actual issue any idea?
use navigation.toggleDrawer()
File structure any videos on how to name folders and files. I see you have lower case and uppercase files and folders
ERROR TypeError: Cannot read property 'style' of undefined, js engine: hermes
ERROR Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called., js engine: hermes
Спасибо
TypeError: undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions')
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.
same here, solved?
I have the same problem
@@quemperguntou2692 Bro watch this. ua-cam.com/video/6F-J7Ek5CGA/v-deo.html
Please make a course on drag and drop between the list . please
Drawer submenu video poduga
start with 7.30
super!
nice
Awesom
🔥
thx for the tutorial but the music in the background is annoying
Awesome +++++++++++++++++++++++++++++
AppStack me AuthStack ka function bana diya
Discord group please !
The graphic is poor I can't get clearly the pic
aaqui heleena
Use hindi
The repository is out of date (sad)
updated now