Get Started

Installation

npm i react-native-shimmer-loading --save

or

yarn add react-native-shimmer-loading

Usage

Simple

For react-native-linear-gradient

import LinearGradient from 'react-native-linear-gradient';
import ShimmerPlaceHolder from 'react-native-shimmer-loading'

...

<ShimmerPlaceHolder
  LinearGradient={LinearGradient}
/>

Props

| Prop | Description | Type | Default | | ---------------------------- | ------------------------------------------------------------------------------------------------------ | --------- | ------------------------------------------------- | | LinearGradient | Linear Gradient components ('react-native-linear-gradient' or 'expo-linear-gradient') | Component | undefined | | visible | Visible child components | boolean | false | | style | Container Style | Style | {backgroundColor: '#ebebeb',overflow: 'hidden'} | | shimmerStyle | Shimmer Style only | Style | {} | | contentStyle | Content Style when visible | Style | {} | | duration | Duration of shimmer over a row | number | 1000 | | reverseLoop | Direction of loop | number | true | | shimmerWidthPercent | Percent of shimmer width | number | 1.0 | | isReversed | Reverse direction of animation | boolean | false | | shimmerColors | Colors of the shimmer. | string[] | ['#ebebeb', '#c5c5c5', '#ebebeb'] | | containerProps | Props passed to the outermost View | ViewProps | undefined | | shimmerContainerProps | Props passed to the View which contains the loading animation | ViewProps | undefined | | childrenContainerProps | Props passed to the View which contains the children | ViewProps | undefined |

Contribute

Welcome help me to build this awesome lib.

License

MIT