反应原生阴影iOS

时间:2019-04-02 04:51:21

标签: react-native shadow effect

我有一个具有以下样式的组件

 shadowOffset: { width: 0, height: 4 },
      shadowColor: Colors.grey,
      shadowOpacity: 0.5,
      shadowRadius: 2,
      // overflow: 'visible',
      borderRadius: 5,

但是它给了我容器内所有元素的阴影。如何仅对容器(卡)本身应用阴影?

enter image description here

1 个答案:

答案 0 :(得分:1)

例如,您必须给容器一个backgroundColor:'white'

container:{
  backgroundColor:'white',
  borderRadius: 5,
  ...Platform.select({
     ios: {
       shadowOffset: { width: 0, height: 4 },
       shadowColor: Colors.grey,
       shadowOpacity: 0.5,
       shadowRadius: 2,
       // overflow: 'visible',
      },
     android: {
       elevation: 4
     },
    })
}