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.
Check out this React Native Tutorial In Hindi - 2022: ruclips.net/p/PLvN7nvnjkvpQribRyQ4r0FYZxKsPLGciy Pikashow App Clone React Native In Hindi - 2022: ruclips.net/p/PLvN7nvnjkvpRoniWuJoj2gF3bpvHgrzoX
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 🤲🏾🙏)
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?
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
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.
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?
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
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?
Hi , I got one error and error is ERROR Invariant violation requireNativeComponent :"RNSScreen" was not found in the UIManager. How to fix this error ?
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
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).
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
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 //
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.
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?
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.
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
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
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?
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.
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
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 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.
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.
How to add drop down in react navigation drawer. This video was very informative.
Excellent tutorial for the beginners to get the concept
Thank You So much, your video help me to create custom drawer easily.
Bro please make complete course and one project
Yes really need it
Check out this
React Native Tutorial In Hindi - 2022: ruclips.net/p/PLvN7nvnjkvpQribRyQ4r0FYZxKsPLGciy
Pikashow App Clone React Native In Hindi - 2022: ruclips.net/p/PLvN7nvnjkvpRoniWuJoj2gF3bpvHgrzoX
Great content! Really helped me grab RN6 custom drawer concept easily. 👍
Great Explanation bro... You really saved me 🙌🙌
As you said at 15:00 this props will not working for drawer item but why?
again - thank you! These videos are awesome
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 🤲🏾🙏)
Thank you so much! very useful tutorial it's really helpful, good luck Sir.
thanks man , you are doing great job
Love this tutorial. Thank you.
Thank you for such informative tutorials
Thank you so much , Really Helpful Video
That was awesome!
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?
Legend...Great video!!
do you have idea if i want make drawerContent in class component because it never use props
as this way
thanks!!!Your videos are awesome!!!!
it was so helpful thank you so much
thanks it was really helpful
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
Awesome 👍👍 video
Exactly what I needed sir, thank you 🤲
Great Explaination! Thanks for this video ..
Thanks a ton! In case I need to show hamburger icon and custom with other icon, how I can do that?
amazing bro. i like your videos
Thanks for this great video, it was very helpful!
Really Really Really good job
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.
you saved my day. Thank you. Can you do a video about User registration and Login using Firebase?
Amazing tutorial bro
Thanks brother! 🙂
My Man. Thanks a lot.
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?
Thank you bro, you saved me!!
Wow!👍👍👍 Thank you!
This was very helpful thanks a lot sir!
Awesome tutorial
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
Very helpful!
Best tutorial
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?
Hi ,
I got one error and error is
ERROR Invariant violation requireNativeComponent :"RNSScreen" was not found in the UIManager.
How to fix this error ?
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?
Tks for share man!
How do you config google fonts globally in your project?
How did you do the introduction demo video of the app mockup
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? :((((
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).
my drawer overlays the previous screen instead of pushing it, how can i configure this behavior ?
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
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
I have error: Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin?
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!?
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.
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?
How do we get nesting navigation like a onboard screen and a home screen with navigation.replace() funtion
Sir yeh error arha ha
TypeError: navigation.openDrawer is not a function. (In 'navigation.openDrawer()', 'navigation.openDrawer' is undefined)
Nice tutorial
Thank you! Cheers!
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
How to add border below side drawer categories name? and one more picture?
thanks for your efforts, but please reduce the music or disable it in order for us to focus on your great content.
please make a video on how to create a sub menu on react native navigation drawer
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
File structure any videos on how to name folders and files. I see you have lower case and uppercase files and folders
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
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
Does this navigation could be combined with tab navigator?
Yes
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()
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. ruclips.net/video/6F-J7Ek5CGA/видео.html
Please make a course on drag and drop between the list . please
i'm facing some issues with drawer navigation
does anyone know how to hide a bottom tab navigation from showing inside the drawer?
Cannot find module 'babel-plugin-r'
ionicons are showing on iOS.. plz help me
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
thanks brow
undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions')
Getting this error .. anyone help please :(
Same here
nice one
Спасибо
bro navigation drawer not working for mee plz help mee bro
how to set drawer in bottom tabs
Awesom
super!
Drawer submenu video poduga
🔥
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.
Awesome +++++++++++++++++++++++++++++
nice
start with 7.30
thx for the tutorial but the music in the background is annoying
The graphic is poor I can't get clearly the pic
AppStack me AuthStack ka function bana diya
Discord group please !
The repository is out of date (sad)
updated now
aaqui heleena
Use hindi