在scrollView中反应本机100%宽度的视图

时间:2019-12-28 18:40:17

标签: react-native view scrollview

我有一个水平的ScrollView

在此ScrollView中,我要显示多个全高和全宽视图。

我不知道如何将每个视图的宽度设置为100%。

实际上就像它们具有“自动”宽度(大约70%)

<SafeAreaView style={styles.container}>
    <ScrollView
      style={styles.info}
      horizontal={true}
    >
      {this.state.list.map(item => (
        <View style={styles.item}>...</View>
      ))}
    </ScrollView>
  </SafeAreaView>

还有样式

info: {
 width: "100%",
 height: "100%",
 display: "flex"
},
item: { // props for the items in my views
 display: "flex",
 alignItems: "center",
 justifyContent: "space-between",
 height: "100%",
 paddingTop: 30,
 paddingBottom: 10
}

我试图放width : "100%",但当然不能像例外那样工作

谢谢

1 个答案:

答案 0 :(得分:2)

您必须计算设备或容器的宽度。

import { Dimensions } from 'react-native';

const screenWidth = Dimensions.get('window').width;