web-dev-qa-db-fra.com

Comment trouver la hauteur de la barre d'état dans Android à React Natif?)

Comment trouver la hauteur de la barre d'état sur Android à React Native?)?

Si je vérifie le React.Dimensions height La valeur semble inclure également la hauteur de la barre d'état, mais j'essaie de trouver la hauteur de la présentation sans la barre d'état.

androidreact-nativestatusbar
37
Zohar Levin

Vous n'avez plus besoin de plugins pour cela, utilisez simplement StatusBar.currentHeight:

import {StatusBar} from 'react-native';
console.log('statusBarHeight: ', StatusBar.currentHeight);

EDIT: Apparemment, cela semble fonctionner sur Android toujours, mais sur iOS, initialement undefined est bien renvoyé :(

65
IjzerenHein

Malheureusement, à partir de la version 0.34, l’API pour ce faire est toujours incohérent d’une plate-forme à l’autre. StatusBarManager.HEIGHT Vous donnera la hauteur actuelle de la barre d'état sur Android.

import { Platform, NativeModules } from 'react-native';
const { StatusBarManager } = NativeModules;

const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 20 : StatusBarManager.HEIGHT;

Sur iOS, vous pouvez utiliser getHeight()

StatusBarManager.getHeight((statusBarHeight)=>{
  console.log(statusBarHeight)
})

En remarque, si vous souhaitez que votre application s'affiche sous la barre d'état sous Android semblable au comportement iOS par défaut, vous pouvez le faire en définissant un couple d'accessoires sur <StatusBar> comme suit:

<StatusBar translucent={true} backgroundColor={'transparent'} {...props} />
23
jmurzy