CODEWITHSUNDEEP
reactjsreact-nativereact-navigation
David Vittori
David Vittori

Reputation: 1196

iPad Tab Bar React Navigation

I have a problem only in the iPad mini 2 I am getting the tab bar of my app generated by react navigation (icon + label) in row instead of column. In the other devices iPhones and iPad Pro, Android, I get the icon and the label in column. Do you know any possible problem that could be causing this

Upvotes: 0

Views: 1711

Answers (2)

Haffez Mohamed
Haffez Mohamed

Reputation: 89

The best solution is to specify the labelPosition in tab bar options tabBarOptions={{ labelPosition: "below-icon" }}>

Upvotes: 9

David Vittori
David Vittori

Reputation: 1196

I solved adding this in the tab bar navigation 

 createBottomTabBar({
   tabBarOptions: { 

   ... 
      tabStyle: { 
        flexDirection: 'column', 
        alignItems: 'center', 
        justifyContent: 'space-around' }, 
      }
 })

Upvotes: 0

Related Questions