使用插件：react-native-shadow
1.安装 react-native-shadow
npm install react-native-shadow
2.安装react-native-svg
npm install react-native-svg
3.将react-native-svg链接如项目
react-native link react-native-svg
4.demo代码
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View,TouchableOpacity} from 'react-native';
import {BoxShadow} from 'react-native-shadow'
export default class App extends Component {
render() {
const shadowOpt = {
width:160,
height:30,
color:"#000000",
border:2,
radius:5,
opacity:1,
x:1,
y:1,
}
return (
<View style={styles.container}>
<BoxShadow setting={shadowOpt}>
<TouchableOpacity >
<View style={{width:160,height:30,justifyContent:"center",alignItems:"center"}}>
<Text style={{color:"#ffffff"}}>
点击
</Text>
</View>
</TouchableOpacity>
</BoxShadow>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#FFFFFF',
}
});
效果图：
