React-native-router-flux: Navigation bar height?

Created on 13 Oct 2016 · 3Comments · Source: aksonov/react-native-router-flux

Version

react-native-router-flux v3.35.0
react-native v0.35.0

How can I get navigation bar height to add margin to the container view because the navigation bar overlap my container view?

Source

maphongba008

Most helpful comment

@maphongba008
If needed styles
...Platform.select({
ios: {
top: 64,
},
android: {
top: 54,
}
}),

If you using ScrollView or ListView
<ScrollView
contentInset={{top: (Platform.OS !== 'ios' ? 54 : 64), left: 0, bottom: 0, right: 0}}
contentOffset={{x: 0, y: -(Platform.OS !== 'ios' ? 54 : 64)}}
/>

YuriyUlantsev on 13 Oct 2016

👍8

All 3 comments

@maphongba008
If needed styles
...Platform.select({
ios: {
top: 64,
},
android: {
top: 54,
}
}),

YuriyUlantsev on 13 Oct 2016

👍8

Tks. I just found the answer at #561

maphongba008 on 13 Oct 2016

While working on android implementation of my app, I couldn't find any mention of navigation to be of height 54 in Material UI docs here. Seems that App bar (called NavBar here) should be 56 for mobile portrait layout case.
structure - layout - material design guidelines