react-native-bounceable

🚀 Animate and bounce any component with RNBounceable for React Native

Downloads
35.1K
Stars
71
Committers
1

Version 1 🚀

Finally we're published the version 1 for the bounceable library

  • Much better animation with pressIn and pressOut bounces 😍
  • More than 90k downloads and battle tested 💪

Installation

Add the dependency:

npm i @freakycoder/react-native-bounceable

Usage

Import

import RNBounceable from "@freakycoder/react-native-bounceable";

Fundamental Usage

You can put ANY children component inside the RNBounceable component, it will make it bounce when it is pressed

<RNBounceable onPress={() => {}}>
  <View style={styles.bounceButtonStyle}>
    <Text style={styles.bounceButtonTextStyle}>Bounce</Text>
  </View>
</RNBounceable>

Configuration - Props

Property Type Default Description
onPress function undefined set your own logic for the onPress functionality
style style undefined set the style like any other View container
bounceEffect number 0.9 change the bounce effect's value
bounceFriction number 3 change the bounce effect's friction value
useNativeDriver boolean true change the useNativeDriver's usage
animate function default activate the bounce effect animation

Future Plans

  • LICENSE
  • More customizable animation props
  • Write an article about the lib on Medium

Author

FreakyCoder, [email protected]

License

React Native Bounceable is available under the MIT license. See the LICENSE file for more info.

Package Rankings
Top 3.6% on Npmjs.org
Badges
Extracted from project README
Battle Tested ✅ Animate and bounce any component with RNBounceable for React Native npm version npm License: MIT styled with prettier