@thevsstech/react-native-skeleton

Skeleton

Skeleton is a React Native library to easily create an amazing loading effect. [ANDROID & IOS]


$3

> 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
`

$3

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 (





marginTop={6}
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 (





style={{ marginTop: 6, width: 80, height: 20, borderRadius: 4 }}
/>



);
};
``

$3

#### 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 |

$3

Any help this module will be appreciated!

$3

MIT