react-native - 如何在React Native中设置 View 的背景颜色透明

Question

这是我使用过的 View 样式

backCover: {
  position: 'absolute',
  marginTop: 20,
  top: 0,
  bottom: 0,
  left: 0,
  right: 0,
}

目前它有白色背景。我可以根据需要更改背景颜色，例如 '#343434'，但它仅接受最大 6 个十六进制颜色值，因此我无法像 '#00ffffff' 那样提供不透明度。我尝试使用这样的不透明度

backCover: {
  position: 'absolute',
  marginTop: 20,
  top: 0,
  bottom: 0,
  left: 0,
  right: 0,
  opacity: 0.5,
}

但它降低了 View 内容的可见性。那么有答案吗？

Answer 1

使用rgba值作为backgroundColor。

例如，

backgroundColor: 'rgba(52, 52, 52, 0.8)'

这会将其设置为不透明度为 80% 的灰色，该颜色源自不透明度小数 0.8。该值可以是 0.0 到 1.0 之间的任何值。