在反应原生中将组件高度设置为100％

Question

我可以给出样式数值的高度元素，例如40，但这些值必须是整数。如何让我的组件的高度为100%？

Answer 1

查看flexbox doc。在样式表中，使用：

flex:1,

Answer 2

将窗口高度抓取到变量中，然后将其指定为要定位的Flex容器的高度：

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

在你的风格中：

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

请注意，您必须在使用之前导入尺寸：

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

Answer 3

您只需将height: '100%'添加到商品的样式表即可。 它对我有用

Answer 4

尝试一下：

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

您可以在本机在线文档（https://facebook.github.io/react-native/docs/height-and-width）中获得更多帮助。

Answer 5

尝试：

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

}

Answer 6

<View style={styles.container}> </View>

常量样式= StyleSheet.create（{ 容器： { 弹性：1 } }）