A simple React Native component that implements a Skeleton UI. It will performance your react-native app and you will get more fps ( this library only works in a bare react-native app ).
if you are using expo, please use this lib: react-native-ui-skel-expo
- Install your skel
npm i react-native-ui-skel- install react-native-linear-gradient (if you already have it, jump this step)
npm i react-native-linear-gradient- install new pods (only iOS)
npx pod-installimport { Skel } from 'react-native-ui-skel'
<View>
<Skel
height={40}
width={300}
styles={{ borderRadius: 4 }}
/>
</View>| Name | Type | Default | Description |
|---|---|---|---|
| height | number | required | Skel height |
| width | number | required | Skel width |
| duration | number | 1000 ms | Duration of the animation |
| styles | object | {} | The style applied to the Skel |
| backgroundColor | string | #EBEFF5 | The color of the Skel background |
| backgroundAnimationColor | array | ['transparent', 'rgba(0,0,0, 0.03)', 'transparent'] | The color of the Skel animation (this gives UI touch) |