SkeletonPlaceholder is a React Native library to easily create an amazing loading effect.
npm install @thevsstech/react-native-skeletonSkeleton is a React Native library to easily create an amazing loading effect. [ANDROID & IOS]

> Note: If your project already includes the react-native-linear-gradient you can skip the Step #1
###### Step #1
Using yarn:
``bash`
yarn add react-native-linear-gradient
Using npm:
`bash`
npm install react-native-linear-gradient --save
If you are running a react-native version below 0.60:
`bash`
react-native link react-native-linear-gradient
Otherwise:
`bash`
cd ios
pod install
###### Step #2
Using yarn:
`bash`
yarn add @thevsstech/react-native-skeleton
Using npm:
`bash`
npm install @thevsstech/react-native-skeleton --save
There are two ways to use this package:
with SkeletonPlacehoder.Item 🆕
`javascript
import React from "react";
import { View } from "react-native";
import Skeleton from "@thevsstech/react-native-skeleton";
const App = () => {
return (
width={80}
height={20}
borderRadius={4}
/>
);
};
`
or with View
`javascript
import React from "react";
import { View } from "react-native";
import Skeleton from "@thevsstech/react-native-skeleton";
const App = () => {
return (
/>
);
};
``
#### Skeleton
| Prop | Description | Type | Default |
| :-------------: | :--------------------------------------------: | :----: | :-------: |
| backgroundColor | Determines the color of placeholder | string | _#E1E9EE_ |
| highlightColor | Determines the highlight color of placeholder | string | _#F2F8FC_ |
| speed | Determines the animation speed in milliseconds | number | _800_ |
#### Skeleton.Item
| Prop | Description | Type | Default |
| :--: | :-------------------------------: | :--: | :-----: |
| any | Any view style props was accepted | any |
Any help this module will be appreciated!