web-dev-qa-db-fra.com

Définition de la hauteur du composant à 100% en réactif natif

Je peux donner à l'élément height de style des valeurs numériques telles que 40 mais elles doivent obligatoirement être des entiers. Comment faire en sorte que mon composant ait une hauteur de 100%?

react-native
33
lhahne

consultez le flexbox doc . dans la feuille de style, utilisez:

flex:1,
33
wangii

Saisissez la hauteur de la fenêtre dans une variable, puis assignez-la à la hauteur du conteneur Flex que vous souhaitez cibler:

let ScreenHeight = Dimensions.get("window").height;

Dans tes styles:

var Styles = StyleSheet.create({ ... height: ScreenHeight });

Notez que vous devez importer des dimensions avant de l’utiliser: 

import { ... Dimensions } from 'react-native'
33
Tsilavina

Vous pouvez simplement ajouter height: '100%' dans la feuille de style de votre article . Ça marche pour moi

12
Umino San

Essaye ça:

  <View style={{flex: 1}}>
    <View style={{flex: 1, backgroundColor: 'skyblue'}} />
  </View>

Vous pouvez avoir davantage d’aide pour la documentation en ligne native-react ( https://facebook.github.io/react-native/docs/height-and-width ).

0
just like before

essayez le:

container: {
    position: 'absolute', 
    top: 0, 
    bottom: 0, 
    left: 0, 
    right: 0

}
0
Aras