Android Navigation Bar height React-Native
I'm trying to get the Android Bottom bar working (the bar where you have the back button) height with RN. I did the following:
Dimensions.get('window').height
I get the height with this bar! Since it can or cannot be there and can be bigger or larger depending on the settings, this is a big issue for me.
- In iOS devices,
screenHeight === windowHeight
; - In Android devices with bottom navigator bar,
screen height === windowHeight + statusBarHeight + bottomNavigatorBarHeight
; - In Android devices without bottom navigator bar,
bottomNavigatorBarHeight
is zero.
import {Dimensions, StatusBar} from 'react-native';
const SCREEN_HEIGHT = Dimensions.get('screen').height; // device height
const STATUS_BAR_HEIGHT = StatusBar.currentHeight || 24;
const WINDOW_HEIGHT = Dimensions.get('window').height;
I use sheet below to do that:
// RN version:0.57.0
let deviceH = Dimensions.get('screen').height;
// the value returned does not include the bottom navigation bar, I am not sure why yours does.
let windowH = Dimensions.get('window').height;
let bottomNavBarH = deviceH - windowH;