react-native-fb-shimmer
Simple shimmering effect in React Native using native shimmer libraries by Facebook Shimmer/shimmer-android.
Support
The library supports react native's New Architecture
Works for React Native versions >= 0.60
Usage
NOTE: Shimmer
may only have one child.
import Shimmer from "react-native-fb-shimmer";
<Shimmer>
<Text>Hello World</Text>
</Shimmer>;
Properties
Prop | Description | Default |
---|---|---|
animating |
Whether or not to show shimmering effect. | true |
duration |
The shimmering animation duration in milliseconds. | 1000 |
pauseDuration |
The time interval between shimmerings in milliseconds. | 400 |
animationOpacity |
The opacity of the content while it is shimmering. | 1 |
shimmeringDirection |
The direction of shimmering animation, valid values are up , down , left , right . |
right |
shimmeringOpacity |
The opacity of the content before it is shimmering. | 0.5 |
highlightLength |
The highlight length of shimmering. Range of 0–1. iOS only | 1 |
beginFadeDuration |
The duration of the fade used when shimmer begins. iOS only | 0 |
endFadeDuration |
The duration of the fade used when shimmer ends. iOS only | 0 |
tilt |
The tilt angle of the highlight, in degrees. Android only | 0 |
intensity |
The intensity of the highlight mask. Range of 0–1. Android only | 0 |
License
MIT