React Native 阴影效果 react-native-shadow

RN中阴影效果仅支持ios，实现ios端阴影类似如下：

 	shadowColor: '#999',  //设置阴影色
    shadowOffset:{width:0,height:0},  //设置阴影偏移,该值会设置整个阴影的偏移，width可以看做x,height可以看做y,x向右为正，y向下为正
    shadowOpacity: 1,
    shadowRadius: 1.5,  //设置阴影模糊半径,该值设置整个阴影的半径，默认的效果就是View的四周都有阴影

实现android端阴影代码如下：

	//该值只在android5.0(包含)以上的机型才支持
    //无法指定阴影的颜色以及偏移，只能设置阴影的高度
    //阴影效果主要在底部，其它三面也有一个层次感,跟ios四面阴影效果不一样
    elevation:1.5,

上述添加阴影效果不佳，两端差别较大

• 三方插件： react-native-shadow
  使用：

	yarn add react-native-shadow
	yarn add react-native-svg

import {BoxShadow} from 'react-native-shadow'

const shadowOpt = {
                width: 668, // 与子元素高一致
                height: 300,// 与子元素宽一致
                color: '#000', // 阴影颜色
                border: 7, // 阴影宽度
                radius: 10, // 与子元素圆角一致
                opacity: 0.45, // 透明
                x: 0, // 偏移量
                y: 0,
                style: { marginVertical: 5 }
        }
....
 
render = () => {
	return (
		<View>
			<Shadow setting={shadowOpt}>
				<View style={{width:668,height:300,backgroundColor:'#FFF'}}/>
			</Shadow>
		</View>
	)
}

tips：必须设置固定宽高

效果图