2.1.2 • Published 2 years ago
@wave909/react-native-inset-shadow v2.1.2
@wave909/react-native-inset-shadow
Inset shadows for react native components
Fork of https://github.com/rohailaltaf/react-native-inset-shadow that adds support for:
- Full Android styling
- TypeScript
Setup
This library is available on npm, install it with: npm i @wave909/react-native-inset-shadow
or yarn add @wave909/react-native-inset-shadow
Usage
import InsetShadow from 'react-native-inset-shadow'
import { Text, View } from 'react-native'
const ViewWithInsetShadow = () => {
return (
<View style={{ height: 150 }}>
<InsetShadow>
<View style={{ flex: 1, justifyContent: 'center', alignSelf: 'center'}}>
<Text>This view has an inset shadow!</Text>
</View>
</InsetShadow>
</View>
)
}
Props
Name | Type | Default | Description |
---|---|---|---|
children | node | null | (Required) child components to sit inside the view |
left | bool | true | (Optional) show left inset shadow? |
top | bool | true | (Optional) show top inset shadow? |
right | bool | true | (Optional) show right inset shadow? |
bottom | bool | true | (Optional) show bottom inset shadow? |
shadowColor | string | black | (Optional) shadow color |
shadowOffset | number | 1 | (Optional) how much to offset the shadow on the horizontal/vertical axis |
shadowOpacity | number | 0.5 | (Optional) shadow opacity |
shadowRadius | number | 3 | (Optional) shadow radius |
elevation | number | 5 | (Optional) shadow elevation for android |
containerStyle | object | {} | (Optional) style for the container |