React Native library with Android native view which supports same shadows styles as iOS. Based on the https://github.com/L-Briand/ShadowLayout.
npm install @dimaportenko/react-native-shadow-view![]() | ![]() |
|---|
import*asReactfrom'react';import{StyleSheet,View}from'react-native';import{ShadowView}from'@dimaportenko/react-native-shadow-view';exportdefaultfunctionApp(){return(<Viewstyle={styles.container}><Viewstyle={styles.row}><ShadowViewstyle={[styles.box1,styles.shadow1]}><Viewstyle={styles.inner}/></ShadowView><ShadowViewstyle={[styles.box2,styles.shadow2]}/></View><Viewstyle={styles.row}><ShadowViewstyle={[styles.box3,styles.shadow3]}/><ShadowViewstyle={[styles.box4,styles.shadow4]}/></View><Viewstyle={styles.row}><ShadowViewstyle={[styles.box5,styles.shadow5]}/><ShadowViewstyle={[styles.box6,styles.shadow6]}/></View></View>);}conststyles=StyleSheet.create({container: {flex: 1,alignItems: 'center',justifyContent: 'center',},box1: {width: 100,height: 100,margin: 40,backgroundColor: 'white',borderRadius: 15,},inner: {width: 100,height: 100,borderRadius: 15,},box2: {width: 100,height: 100,margin: 40,backgroundColor: 'gray',},box3: {width: 100,height: 100,margin: 40,backgroundColor: 'yellow',},box4: {width: 100,height: 100,margin: 40,backgroundColor: 'green',},box5: {width: 100,height: 100,margin: 40,backgroundColor: 'pink',},box6: {width: 100,height: 100,margin: 40,backgroundColor: 'blue',borderRadius: 4,},shadow1: {shadowColor: 'blue',shadowOffset: {width: 2,height: 4,},shadowOpacity: 0.6,shadowRadius: 4.65,},shadow2: {shadowColor: '#0F0',shadowOffset: {width: 2,height: 4,},shadowOpacity: 0.6,shadowRadius: 4.65,},shadow3: {shadowColor: '#000',shadowOffset: {width: -2,height: -4,},shadowOpacity: 0.7,shadowRadius: 5.65,},shadow4: {shadowColor: '#000',shadowOffset: {width: 2,height: 4,},shadowOpacity: 0.6,shadowRadius: 4.65,},shadow5: {shadowColor: 'pink',shadowOffset: {width: -4,height: 4,},shadowOpacity: 1,shadowRadius: 4.65,},shadow6: {shadowColor: '#000',shadowOffset: {width: 2,height: 4,},shadowOpacity: 0.6,shadowRadius: 4.65,},row: {flexDirection: 'row',},});See the contributing guide to learn how to contribute to the repository and the development workflow.
MIT

