react-native-animated-component
react-native-animated-component copied to clipboard
Published
20 hours ago •
WrathChaos
WrathChaos
Animate any component with React Native Animated Component
|
|
Installation
Add the dependency:
npm i react-native-animated-component
Peer Dependencies
Zero Dependencies
Usage
Import
import RNAnimated from "react-native-animated-component";
Fundamental Usage
<RNAnimated
appearFrom="left"
animationDuration={1300}
style={{ alignItems: "center" }}
>
{staticData.map(() => renderItem())}
</RNAnimated>
Example Project 😍
You can checkout the example project 🥰
Simply run
-
npm i -
react-native run-ios/android
should work of the example project.
Configuration - Props
Fundamentals
| Property | Type | Default | Description |
|---|---|---|---|
| appearFrom | AppearFrom | "left" | The component will appear from that direction |
| animationDuration | number | 300 | change the animation duration |
| style | ViewStyle | default | set or override the style object for the main container |
| initialDelay | number | default | change the initial delay of the appearing animation |
| delayInterval | number | 200 | change the each children's delay interval in each appearing animation |
Future Plans
- [x] ~~LICENSE~~
- [ ] More Animation Type
- [x] ~~Opacity~~
- [ ] Solid Movement
- [ ] Scale
- [ ] Write an article about the lib on Medium
Credit
Heavily inspired from aarkalyk's awesome polls app
Author
FreakyCoder, [email protected]
License
React Native Animated is available under the MIT license. See the LICENSE file for more info.
Metadata
19
Stars
2
Forks
Watchers
Owner
WrathChaos
Metadata
Animate any component with React Native Animated Component