在 React Native 中将 View 置于其他 View 之上答案

【问题标题】：Place View on top of other View in React Native在 React Native 中将 View 置于其他 View 之上
【发布时间】：2018-07-27 19:30:27
【问题描述】：

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

我已经尝试使用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,
  }

【问题讨论】：

标签： css reactjs react-native css-position

【解决方案1】：

好的，我找到了问题xD

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

【讨论】：

不适合我我用style={{elevation:1000, zIndex:1000}}

【解决方案2】：

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

【讨论】：

问题是我的行上有一个 elevation 道具，当我删除它时它可以工作。不知道这是否是一个错误，但我想我必须忍受它：P
@howtopythonpls gotcha，你认为一个简单的 z-index 就可以了。干杯
是的，但遗憾的是它没有，完全按照您的描述进行了尝试。我相信在 react-native 中没有 position: fixed 。无论如何谢谢:)