I'm trying to create a drawer menu with React Native Navigation. By default the drawer seems to work only by swiping. I've also tried triggering the drawer with a button. It was all good, but the problem is that I'd like the button (with a hamburger icon) to slide along with the drawer when it is closing/opening. Here are a couple of sketches of what I'd like to see:
I tried searching for information but nothing useful came up. The closest I got was this SO post, but in this case the button triggers a new screen to open, not a drawer menu to slide in.
Is this even possible to do, since I couldn't even find anything in the API docs for the DrawerNavigator? If so, any suggestions would be appreciated.
Related
I've been searching for this all over the internet and it's driving me crazy.
I want to apply animations for when closing a screen on my app, but I want to use a Drawer navigator. All I've found is either for other navigators (stack, modal) or for handling the drawer itself.
Can anyone help me with this? I'm losing my mind over it
I have in design a Bottom Tab Navigation in a page that isn't in the Bottom Tab group of pages... Is it possible to do?
My Bottom Tab Pages are "Station", "Home" and "Menu". I have a "Form" screen, and in the UI this Form has the Bottom Tab... Is it possible in React Native?
It seems like impossible and I didn't find nothing in docs (React Navigation / React Native)
Edit: Putting a design example.
Pay attention, in the image above, the "Workers Form" isn't in the bottom menu group of pages, but I need to show the bottom menu in this page too (Workers Form)...
I didn't find any information about it in React Navigation docs, so I don't know if it's possible.
You need to embed a Stack.Navigator inside your Tab.Navigator.Please refer to my answer here for a code example.
I'm new to react-native and I'm trying to add a feature to my navigation. Basically I would like it when you click on a drawer item it would stack a new page accompanied by a back button.
I've searched everywhere to try and figure it out but couldn't find an answer.
The feature is used in an app in the images below.
The arrow next to 'Dublin Bikes' is used for closing drawer menu (not a stack arrow).
After the drawer is opened and you pick either "Settings" or "My Account" a single page is stacked.
It's pretty much using the drawer item as a button to call a stack.
Is there a good way to do this? All I have found is to rebuild the drawer and add them as buttons. That didn't seem right.
Any help would be great. Thanks a lot.
when you click on a drawer item it would stack a new page accompanied by a back button,
what i understood is when you click on drawer button on home screen it should navigate to new screen with back button and not the one currently showing,
i feel for this feature, instead for drawer you can have a custom drawer open button on the header and when you click on that it will navigate ( navigation.navigate("newpage") ) to you new page accompanied by a back button
I want to implement an application with react drawer navigation for side menu. For a simple example with three screens it work that in each screen a hamburger icon exist and with clicking on it , navigate to proper screen. My problem is that I want to add the side menu in all my pages but I don't to include all pages in side menu. I have no idea how to do it.
Thanks for any help.
What you are looking for are NavigationActions and DrawerActions.
Snack example
And link to docs
I have not been able to find any example of such a navigation but essentially I am attempting to have a regular tab navigator with 4 tabs. What I want is for the right-most tab to open a drawer instead of showing a tab screen. You should be able to push it or swipe to it and pull out the drawer. Is this possible?
I think it is possible, just have to use Actions.drawerOpen() in action of tab. If not get what I say, then please post your code, so I can give more details on it.
Thanks