as there are too many tabs on my 2nd level of bottom tab i need to make it scrollable in Horizontal directions , so that master class can be in one line
i'm using createBottomTabNavigator from #react-navigation/bottom-tabs
i tried to use flatlist but in screens we cant use flatlist , i just want it to make scrollable , i checked createBottomTabNavigator page from react-native i didn;t found anything related to srolling
Related
I want my screen's header to scroll along with the tabs, Each of the tabs has infinite data so I am using FlatList to display it.
The problem is if I am displaying the header in simple View then that part doesn't scroll with the tab.
I tried to put the scroll view on top and then FlatList into it but that again is a performance issue.
Please suggest an optimized and better solution for the following.
I am using the latest versions of react native and react navigation.
I have five screens in a material bottom tab navigator. On one of the screens, I want to use a drawer for some settings. In the other screens there are currently no drawers planned, however if they come, they will have different content from this current one.
I want the drawer to be displayed above the bottom navigation bar. However I don't want to solve it by wrapping the whole material bottom tab navigator in a drawer navigator, as this would not make much sense and also provide the same drawer in all of the screens.
Is there another way of making the drawer appear on top of the bottom navigation bar? Ideally, the solution would not include react-navigation for the drawer at all, as I don't use it for navigation.
The answer appears to be to use a Modal, which can server as a popup. https://reactnative.dev/docs/modal for the documentation.
I need a way to create a tab bar that will vertically bump up the upper text and stick to the top of the page.
I currently am using createMaterialTopTabNavigator and it sits in the vertical center of the screen. I would like such that when a person scrolls on the subpages from the tab navigator for the whole page to scroll with it until the topTabNavigator sticks to the top of the screen.
I am currently using React Native + Expo.
I am open to different options as well. I have tried using a panel and embedding the tab bar in that but it caused weird scrolling issues on Android devices.
Thanks!
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 create a view with an animated shrinking header with a tabview that contains tabs with flatlist(such as google play). See Image.
I'm using react-navigation with a TabNavigator. The header is a component with a fixed height, currently above the TabNavigator. The header is fixed above the tabs all the time taking precious space.
I've tried React Native: Animate shrinking header with tabs but I can't get it to work because I gonna integrate flat list in to tab.
This article is using scrollview in tab panel.
Certainly, I am looking for solution for using flatlist.