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

Question

我有一个水平的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%"，但当然不能像例外那样工作

谢谢

Answer 1

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

import { Dimensions } from 'react-native';

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