react-native-animation-library

0.0.8 • Public • Published

React Native Animation Library

Animation library built in JavaScript only. All animation created with Animated API and boosted with useNativeDriver which uses the native animation by RCTAnimation.

Components

AnimatedListView

Fade appearance listView. Based on ListView therefore all ListView props can be used.

API

Props Type Description
initialOpacity [Number] Cell initial opacity, between 0-1
offsetY [Number] Cell Y offset
cellAnimationDelay [Number] Cell animation delay. Multiple cell# * cellAnimationDelay
duration [Number] The animation duration in milliseconds[Number]

FlipAnimatedImage

API

Props Type Description
isSelected [Boolean] The selection state of the component
selectedImage [Image] The image to show when state is selected
unSelectedImage [Image] The image to show when state is unselected
duration [Object] The animation Bounce duration object {bounceOut: [Number], bounceIn: [Number]}

Example

<TouchableOpacity 
    activeOpacity={0.7} 
    onPress={() => this.setState({starIsSelected: !this.state.starIsSelected})} 
    style={{margin: 30}}>
    
    <FlipAnimatedImage style={{justifyContent: 'center', alignItems: 'center'}}
                       isSelected={this.state.starIsSelected}
                       unSelectedImage={require('<SELECTED_IMAGE>')}
                       selectedImage={require('<UNSELECTED_IMAGE>')}
                       duration={{bounceOut: 50, bounceIn: 100}}
    />
</TouchableOpacity>

Readme

Keywords

none

Package Sidebar

Install

npm i react-native-animation-library

Weekly Downloads

1,648

Version

0.0.8

License

none

Last publish

Collaborators

  • wix.mobile
  • gran33