We are using startSingleScreenApp to start the application. We need to hide/show some of the menu option based on screen in the application.
We tried to create two different Drawer with different items but in that case drawer items not getting rendered.
You can set custom component for your drawerMenu instead of default provided menu styling and properties. Create a custom component, and for the menu items, map through an array of menu items provided by redux. Then whenever you need to change the menu items, change the array state in redux and your drawer menu items will re-render and update accordingly.
Related
I'm using React Native Router Flux and have a bottom tab bar. I have a screen set up with a lot of links to other screens on it. If the parent scene isn't added to the tabs, I'm unable to route to it.
I've looked through the documentation and tried various options and styling. I think the easiest option would be to apply a width of 0 to that particular scene group, but it isn't available with View styles.
I want to be able to hide the parent scene so it isn't showing in the tab bar. At the moment, nothing is changing and the item is showing in the tab bar.
Figured it out. The problem was that I had the child scenes nested within a parent scene. When I removed them from the parent and outside of the tabs, it worked perfectly.
Im trying to build a mobile app where we have a constant header bar throughout the app. I have the body where I have buttons.. Each button navigates to a screen. I need the header bar in every screen but I dont wish to repeat the code in all screens. I dont intend to use TabNavigator either. Is there any alternative??
in image1 and image 2 the bar with the search,cart and offerzone tag remains same. The rest changes..I need this behaviour without repeating the header code in both screens.
You can separate the code of headerBar into a independent component, and use redux store to manage this component's props.
After you do this, you just need to import the component in each screen, the component will get its props from redux store automatically. Each screen can contact headerBar with redux actions
I'm using React Navigation (https://reactnavigation.org) to handle navigation in my React Native app. The app structure consists of a StackNavigator with a bunch of nested menus. All the menus use the same MenuScreen component.
When I navigate through 2+ menus, then press the back button, the navigation bar title doesn't change back. It gets stuck on the title set by the "furthest" menu reached.
This makes sense, since I set the static navigationOptions property in the constructor of each successive MenuScreen, but never change it back. What is the best practice for fixing this?
In my current App I have a List of items. If the user clicks on one of these items details should appear. This details should be dispayed in a swiper. So the user can navigate to the details of the next item by swiping left.
Showing the list, the swiper (Modal) and closing the modal swiper is no problem.
But how to "navigate" the swiper to the item, which the user clicks? The data is the same (redux). I don't think, that it's a good idea to set the data of the swiper each time a user clicks on a list item?
Another questions: How to trigger the "navigateToXandShowModal()"-function of the custom component wrapping the swiper? By saving the ref in the parent component? Is this the correct way?
I want all my views to be in a TabBarIOS except one - the login view. Currently in my app.js I render the TabBarIOS with items each containing a NavigatorIOS that loads my different components. But how do I organize my project to have a separate component that doesn't show the tab bar at all?
Can't you use a modal instead?
https://github.com/brentvatne/react-native-modal