Title is not vertically centered in <Navigator.NavigationBar> when using custom height

When using custom height of 50, this is what I get for <Navigator.NavigationBar style={{height: 50}}> (as you can see it’s not vertically centered):

When using a negative marginTop to adjust both the back button and the title, it cuts off the top of the back button:

What’s the proper way to fix this (preferably without negative margin)?

RN 0.30 / Mac OS X 10.11.5 / iPhone 6 / iOS 9.3

P.S: I could only find this other issue, but it’s not too helpful: https://github.com/facebook/react-native/issues/3142

[ifours]

You can try following workaround (you still need to use negative margin):

const navigationStyles = { ...Navigator.NavigationBar.StylesIOS };

navigationStyles.Stages.Left.LeftButton.overflow = 'visible';
navigationStyles.Stages.Center.LeftButton.overflow = 'visible';
navigationStyles.Stages.Right.LeftButton.overflow = 'visible';

navigationStyles.Stages.Left.RightButton.overflow = 'visible';
navigationStyles.Stages.Center.RightButton.overflow = 'visible';
navigationStyles.Stages.Right.RightButton.overflow = 'visible';

And pass as prop to your NavigationBar

[facebook-github-bot]

@charpeni tells me to close this issue. If you think it should still be opened let us know why.