Search code examples
javascriptreactjsreact-nativereact-native-navigationwix-react-native-navigation

Wix React native navigation tab button goes out of bound on navigating back to screen

Pushing to new screen with tabbarHidden set to true and poping back to the screen, tabbar is animated from the left and it looks sloppy. Is it a bug or there is prop i can pass to prevent it from animating.

Expected behaviour is that Tab bar icons should not animate from left

This code hide tab on push

this.props.navigator.push({
  screen: Route.UPLOADS,
  navigatorStyle: {
    tabBarHidden: true
  },
  title: title
})

Bug screen capture

enter image description here

Environment

  • React Native Navigation version: v1.1.493
  • React Native version: ^0.56.0
  • Platform: iOS
  • Device info: iPhone 8, iPhone 6
Solution

  • I was able to fix this issue by adding following line to tabstyle

    tabBarTranslucent: false

    Another solution is to upgrade the wix navigation library to v2.