react-native 如何自定义android高程阴影

Question

使用 android 特定的样式规则，elevation ，我在使用时得到了令人讨厌的“光环”效果。例如，此图像显示 elevation: 20 :

即使是小高度 1,2 或 3 也会使元素看起来是“晕圈”/有边框(坏)

如何为特定于 android 的阴影添加更多自定义以摆脱光环效果。 iOS 有特定的规则，如 shadowOpactiy , shadowRadius , shadowOffset – 但我没有看到任何适用于 android 的内容。

Answer 1

根据官方文档，没有 shadowopacity 或任何更改默认阴影的方法，因为存在
通过设计，通过“ Material 设计”
来源:https://developer.android.com/training/material/shadows-clipping

但是您可以做的是使用具有所需边框的虚拟 View 的组件，然后在渲染函数中使用它，例如

render(){
  <View style={{flex:1}}>
    <Viewwithborder>
     //pass the item you want to have custom elevation here
    </Viewwithborder>
  </View>
}

在您的自定义“viewwithborder”中，您只需执行此操作

   render(){
   <View style={{styles.CustomElevationStyle}}>
      {this.props.children}
   </View> 
}