I am thinking of using Bottom Tab Bar or a Bottom Sheet, but I am unable to make it visible on all screens of my Stack Navigator.
Any idea or suggestion will be hugely appreciated.
You probably need to use redux, and modal from react-native and wrap your component to the root.
if you use component in the root then you can use it anywhere with the help of redux.
Related
So I saw a lot of tutorials with "build in" (React Navigation) components and tools like Bottom Tab bar, etc.! But even if it sounds weird I want to make everything on my own.
I do not want weird navigation with a header and than I can swipe to the side and it all looks native, etc.! I want to have like an <a></a> tag to navigate around. So I think in Html it would look like this:
Home
Is there any chance to get this working in React Native? It's not a problem for me to use librarys for helping to navigate but e.g. with React Navigation it all looks so Native - and I do not want this! :) Maybe anybody can help me with my issue? :D
Henrik, I would suggest you using the createBottomTabNavigator from React Navigation, you can read more here reactnavigation.org/docs/bottom-tab-navigator
how to move a view from left to right ( intially the view should be hidden and on first button click the view should come from left to right with animation ) partially (30%) and then on second click it should open complete .How to acheive this in react native ??
Not sure I completely understand what you are asking but it sounds like a custom navigation might be possible with the library react-navigation . Here is a detailed blog post that shows possible customizations: https://medium.com/async-la/custom-transitions-in-react-navigation-2f759408a053
Solution lays in your approach. Having a View with screen's width doubled, render your two react components, and take a look on how to animate the hidden screen. TranslateX would do the trick.
It would be better for you if you learn Animated. But if you have a deadline or something, react-navigation has drawer navigation. Or if you don't need navigation, there is a library called react-native-gesture-handler which has Drawer created for you.
I want to scale down the screen view when the Drawer Content is open using react-navigation with DrawerNavigator. You can see the expected behavior here. I'm not sure if is it possible, so suggestions using react-navigation are welcome.
react-native-scaling-drawer supposed to work with React Navigation v1.
Let me know if you manage it to work with v2.
I would like to have two buttons on the right side of the navbar. I am using the React Native Navigator component. I know I can put a button to the right side of the navbar but how can I put more than one?
Something like that.
On Android if you are using ToolbarAndroid you can pass an array of items to actions prop.
https://facebook.github.io/react-native/docs/toolbarandroid.html#actions
On iOS if you are using NavigatorIOS unfortunately there is no way you can do such a thing but if you are using Navigator you can design it yourself
https://facebook.github.io/react-native/docs/navigator.html#navigation-bar
I'm building a react-native app and I would like new users to experience one of those slider walkthroughs that explains the app and how to use it, but then never show it again.
What is the best approach to achieve this functionality?
You can use Navigator to achieve this. Push the sliding view into the Navigator, then when you want to exit out of it then use replace(route) function of the Navigator.
The replace(route) method of navigator replaces the current scene with the new route
replace(route) - Replace the current scene with a new route