Some Tabs icon and label disappear when tab array is more than 8 about react-native-material-bottom-navigation HOT 3 OPEN

What kind of Issue is this?

Bug Report
Question / Problem Problem - question
Discussion / Feature Request

Actual behavior

• What is happening?
• Is it happening on Android, iOS or both?
• Could you identify sections in your code which triggers this behavior?

Expected behavior

• What did you expect to happen?
  expect all 8 tab icon and label fit in that bottomNavigation screen

Additional resources

• Provide a way to reproduce the issue. The best way is to re-create the bug using Snack.
• Add Code Snippets which cause your issue.
• Add a screenshot if it helps to show your issue.

Environment

software version
react-native-material-bottom-navigation
react-native or expo
node
npm or yarn

from react-native-material-bottom-navigation.

I had the same problem when numbers of tabs are more than 6, it does not fit into the screen. Should have the scrollable tab behavior. Is there any solution for this?

Basically, we will need scrollview when a number of tabs didn't fit into the screen.

from react-native-material-bottom-navigation.

First of all, I have to notice @Akash-T2S that you didn't fill out the issue template. Please replace the placeholder bullet-points with your answers.

I want to refer you to the material guidelines (https://material.io/design/components/bottom-navigation.html#behavior) which state:

Don’t use more than five destinations [meaning: tabs inside the bottom navigation]. For those cases, try tabs or a navigation drawer.

Bottom navigation bar destinations have fixed positions. They don’t scroll or move horizontally.

I would advise you to follow those guidelines. These guidelines were written to make your UIs better. Breaking them will cause bad user experience.

However, if someone opens a PR which adds a horizontal scrollview into the BottomNavigation, I will take a look at it.

from react-native-material-bottom-navigation.