How to use the expo.Constants.statusBarHeight function in expo

);

const styles = StyleSheet.create({
  backgroundGradient: {
    position: 'absolute',
    top: 0,
    bottom: 0,
    right: 0,
    left: 0,
    zIndex: 0,
  },
  container: {
    paddingHorizontal: theme.SIZES.BASE,
  },
  navbar: {
    top: Constants.statusBarHeight,
    left: 0,
    right: 0,
    zIndex: 9999,
    position: 'absolute',
  },
});

export default Presentation;

}}
        />
      );
    }

    return (

);
  }
};

export default function App() {
  return (
    
      
    
  );
}

const styles = StyleSheet.create({
  content: {
    padding: 16,
    paddingTop: Constants.statusBarHeight + 16
  }
});

ANDROID: color(null, 0.85),
  },
};
const Loading = S.ActivityIndicator`
  margin: 15px;
`;
const Container = S.View`
  flex: 1;
  align-items: center;
  justify-content: flex-start;
  background-color: ${COLOR.BG};
`;
const Header = S.View`
  width: 100%;
  padding: ${HEADER_PADDING}px;
  padding-top: ${HEADER_PADDING + Constants.statusBarHeight}px;
  backgroundColor: ${() => Platform.OS === 'ios' ? COLOR.HEADER.IOS : COLOR.HEADER.ANDROID}
`;
const Logo = S.Image`
  height: 60;
`;
const Divider = S.View`
  background-color: ${COLOR.DIV};
  width: 100%;
  height: 2;
`;
const ScrollView = S.ScrollView`
 margin-top: ${-(HEADER_TOTAL + Constants.statusBarHeight)}px; 
 z-index: -1;
`;
const ScrollContainer = S.View`
  margin-top: ${HEADER_TOTAL + Constants.statusBarHeight + 5}px;

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#000',
  },
  camera: {
    flex: 1,
    justifyContent: 'space-between',
  },
  topBar: {
    flex: 0.2,
    backgroundColor: 'transparent',
    flexDirection: 'row',
    justifyContent: 'space-around',
    paddingTop: Constants.statusBarHeight / 2,
  },
  bottomBar: {
    paddingBottom: isIPhoneX ? 25 : 5,
    backgroundColor: 'transparent',
    alignSelf: 'flex-end',
    justifyContent: 'space-between',
    flex: 0.12,
    flexDirection: 'row',
  },
  noPermissions: {
    flex: 1,
    alignItems:'center',
    justifyContent: 'center',
    padding: 10,
  },
  gallery: {

import { Dimensions } from "react-native";
import { Constants } from "expo";

const {height} = Dimensions.get("window");
const φ = (1 + Math.sqrt(5)) / 2;

export const MIN_HEADER_HEIGHT = 64 + Constants.statusBarHeight;
export const MAX_HEADER_HEIGHT = height * (1 - 1 / φ);

export interface Track {
  name: string;
  artist?: string;
}

export interface Album {
  name: string;
  artist: string;
  release: number;
  cover: number | number[];
  tracks: Track[];
}

import { Dimensions } from 'react-native';
import { Constants } from 'expo';

export const SCREEN_HEIGHT = Dimensions.get('window').height;
export const SCREEN_WIDTH = Dimensions.get('window').width;
export const STATUS_BAR_HEIGHT = Constants.statusBarHeight;

export const BUTTON_GROUP_STYLES = {
  containerStyle: {
    height: 40,
    width: SCREEN_WIDTH * 0.9
  },
  buttonStyle: {
    backgroundColor: 'white'
  },
  selectedBackgroundColor: '#2169F3',
  selectedTextStyle: {
    color: 'orange',
    fontWeight: '900'
  }
};