React Native：阴影行为

Question

你好 React Native 开发者，

下面的代码在标题中生成图像。我只是想知道为什么第一个视图（带有图标）的阴影与黑色视图相比减少了。我添加了可见边框，以便您可以看到两个阴影之间的区别。 “问题”均适用于 Android 和 iOS 平台。 这真的是一个问题还是这只是正常行为？

<>
        <View
          style={{
            alignSelf: 'center',
            marginTop: 50,
            width: 50,
            height: 50,
            shadowColor: '#000',
            shadowOffset: {
              width: 0,
              height: 0,
            },
            shadowOpacity: 1,
            shadowRadius: 16.0,
            borderRadius: 1000,
            borderColor: 'red',
            borderWidth: 1,
          }}>
          <Icon name="cog" type="ionicons" color="black" size={50} />
        </View>
        <View
          style={{
            alignSelf: 'center',
            marginTop: 50,
            width: 50,
            height: 50,
            shadowColor: '#000',
            shadowOffset: {
              width: 0,
              height: 0,
            },
            shadowOpacity: 1,
            shadowRadius: 16.0,
            backgroundColor: '#000',
            borderRadius: 1000,
            borderColor: 'red',
            borderWidth: 1,
          }}
        />
</>

Answer 1

React Native shadow 中的某些功能运行不佳。尝试改用https://github.com/SrBrahma/react-native-shadow-2。

import { Shadow } from 'react-native-shadow-2';

<Shadow>
  <Text style={{ margin: 20, fontSize: 20 }}>?</Text>
</Shadow>