Skip to content

Commit

Permalink
Update readme
Browse files Browse the repository at this point in the history
  • Loading branch information
Le Tom authored and Le Tom committed Sep 1, 2020
1 parent 730f24d commit f4ab200
Showing 1 changed file with 19 additions and 12 deletions.
31 changes: 19 additions & 12 deletions README.md
View file
Expand Up @@ -30,14 +30,12 @@ or
`yarn add react-native-shimmer-placeholder`


That's all!

### Usage

#### Simple
``` js
import { LinearGradient } from 'expo-linear-gradient';
import { createShimmerPlaceholder } from './src/ShimmerPlaceholder'
import { createShimmerPlaceholder } from 'react-native-shimmer-placeholder'
const ShimmerPlaceholder = createShimmerPlaceholder(LinearGradient)

<ShimmerPlaceHolder />
Expand All @@ -47,12 +45,21 @@ const ShimmerPlaceholder = createShimmerPlaceholder(LinearGradient)
</Text>
</ShimmerPlaceHolder>

```
or
``` js
import { LinearGradient } from 'expo-linear-gradient';
...
<ShimmerPlaceHolder
LinearGradient={LinearGradient}
/>

```

#### Connect more components

``` js
import { createShimmerPlaceholder } from './src/ShimmerPlaceholder'
import { createShimmerPlaceholder } from 'react-native-shimmer-placeholder'

const ShimmerPlaceholder = createShimmerPlaceholder(LinearGradient)
const FacebookContent = () => {
Expand Down Expand Up @@ -105,18 +112,18 @@ More Detail see [this](https://github.com/tomzaku/react-native-shimmer-placehold

| Prop | Description | Type | Default |
| ------------------------- | ------------------------------------------------------------------------------------------------------ | -------- | ------------------------------------------------- |
| **`visible`** | visible child components | boolean | false |
| **`visible`** | Visible child components | boolean | false |
| **`style`** | Container Style | Style | `{backgroundColor: '#ebebeb',overflow: 'hidden'}` |
| **`shimmerStyle`** | Shimmer Style only | number[] | *[0.3, 0.5, 0.7]* |
| **`location`** | Location of shimmer | | `{backgroundColor: '#ebebeb',overflow: 'hidden'}` |
| **`width`** | With of row | number | 200 |
| **`location`** | Locations of shimmer | | `{backgroundColor: '#ebebeb',overflow: 'hidden'}` |
| **`width`** | Width of row | number | 200 |
| **`duration`** | Duration of shimmer over a row | number | 300 |
| **`height`** | height of row | number | 15 |
| **`shimmerWidthPercent`** | percent of line placeholder | number | 1.0 |
| **`isReversed`** | Reverse direction | boolean | `true` |
| **`height`** | Height of row | number | 15 |
| **`shimmerWidthPercent`** | Percent of shimmer width | number | 1.0 |
| **`isReversed`** | Reverse direction of animation | boolean | `true` |
| **`stopAutoRun`** | Stop running shimmer animation at beginning | boolean | `false` |
| **`isInteraction`** | Defines whether or not the shimmer animation creates an interaction handle on the `InteractionManager` | boolean | `true` |
| **`shimmerColors`** | Color of the shimmer. | string[] | *['#ebebeb', '#c5c5c5', '#ebebeb']* |
| **`shimmerColors`** | Colors of the shimmer. | string[] | *['#ebebeb', '#c5c5c5', '#ebebeb']* |

### Methods
| Method | Description | Type |
Expand All @@ -125,7 +132,7 @@ More Detail see [this](https://github.com/tomzaku/react-native-shimmer-placehold

### Contribute

Any help this module will be approciate!
Welcome to help me build this awesome lib.

### License

Expand Down

0 comments on commit f4ab200

Please sign in to comment.