reactjs - 反应原生样式

Question

我正在尝试更多地了解 React Native 中的样式。

将元素拖入底部容器（黄色）时，该元素位于下方。

//View

  <View style={styles.container}>
    <View style={styles.itemContainer}>
      <DraggingItem />
    </View>
    <View style={styles.dropContainer}>
           //2nd container
    </View>
  </View>


//STYLING

  container: {
    flex: 1,
    backgroundColor: '#fff',
  },

  itemContainer: {
    backgroundColor: 'green',
    height: (window.height*56)/100,
  },

  dropContainer: {
    flex: 1,
    backgroundColor: 'yellow',
    height: (window.height*40)/100,
  },

// 项目风格

 text: {
    marginTop: 25,
    marginLeft: 5,
    marginRight: 5,
    // alignItems: 'center',
    // justifyContent: 'center',
    textAlign: 'center',
    color: "#fff"
  },

  item: {
    backgroundColor: "red",
    width: window.width,
    height: 80,
    borderRadius: 15
  }

Answer 1

您可以尝试 zIndex 并阅读更多关于它的信息。如果 zIndex 如果您的黄色框比红色框大，那么事情就像您在图像中一样。如果你不想要它，给红色一个更大的 zIndex。