将视图放置在React Native中的其他视图之上

Question

我想要在其他多个视图之上显示一行（或一个视图）。

我尝试使用position: absolute，z-index，并在代码的最后写上我想要的东西。不幸的是，这些都不能解决问题。我怎样才能把这条线放在最前面？

这就是我得到的：

这是代码：

<ScrollView style={styles.container}>

  <View style={styles.items}>
    {this.state.items.map((item, index) =>
      <View style={styles.item} key={index} elevation={3} />
    }
  </View>

  <View style={styles.line} />

</ScrollView>

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  row: {
    margin: 10
  },
  line: {
    backgroundColor: 'blue',
    position: 'absolute',
    top: 0,
    bottom: 0,
    left: 80,
    width: 7,
  }

Answer 1

好，所以我发现了问题xD

显然elevation={3}搞砸了。如果我只是从“视图”行中删除该道具，一切都会正常。

Answer 2

您是否尝试过将其他组件的z-index设置为0，并将该行的索引设置为1？您也可以尝试使用position：fixed属性。希望这会有所帮助