All Projects → WrathChaos → react-native-bounceable

WrathChaos / react-native-bounceable

Licence: other
Animate and bounce any component with RNBounceable for React Native

Programming Languages

typescript
32286 projects
java
68154 projects - #9 most used programming language
objective c
16641 projects - #2 most used programming language
javascript
184084 projects - #8 most used programming language
ruby
36898 projects - #4 most used programming language
Starlark
911 projects

Projects that are alternatives of or similar to react-native-bounceable

react-native-imaged-carousel-card
Fully customizable & Lovely Imaged Carousel Card for React Native
Stars: ✭ 70 (+169.23%)
Mutual labels:  front-end, apple, freakycoder
react-native-permissions-modal
Awesome & Fully Customizable Permissions Modal for React Native
Stars: ✭ 26 (+0%)
Mutual labels:  front-end, apple, freakycoder
react-native-animated-radio-button
Fully customizable animated radio button for React Native
Stars: ✭ 25 (-3.85%)
Mutual labels:  development, front-end, freakycoder
react-native-header-search-bar
Fully customizable header search bar for React Native
Stars: ✭ 101 (+288.46%)
Mutual labels:  front-end, apple, freakycoder
Lab
React UI component design tool
Stars: ✭ 349 (+1242.31%)
Mutual labels:  development, front-end
Mac Setup
🛠️ Front end web development setup for macOS.
Stars: ✭ 265 (+919.23%)
Mutual labels:  front-end, apple
Front End Career
A career guide to Front End Developers
Stars: ✭ 765 (+2842.31%)
Mutual labels:  development, front-end
Grabs
Front-End Development Environment
Stars: ✭ 89 (+242.31%)
Mutual labels:  development, front-end
Dev Practice
Practice your skills with these ideas.
Stars: ✭ 1,127 (+4234.62%)
Mutual labels:  development, front-end
Webthings
A collection of all things web, because my memory sucks and so does yours.
Stars: ✭ 50 (+92.31%)
Mutual labels:  development, front-end
Tailor
An OS X status bar app to quickly check for new releases at Xcodereleases.com
Stars: ✭ 104 (+300%)
Mutual labels:  development, apple
frontend-tools
Links to front-end development tools
Stars: ✭ 143 (+450%)
Mutual labels:  development, front-end
react-native-text-area
Simple and easy to use TextArea for React Native.
Stars: ✭ 20 (-23.08%)
Mutual labels:  development, freakycoder
react-native-beautiful-timeline
Fully customizable, beautifully designed Timeline for React Native.
Stars: ✭ 111 (+326.92%)
Mutual labels:  apple, freakycoder
react-native-input-bar
Fully customizable, beautifully designed Input Bar for React Native
Stars: ✭ 32 (+23.08%)
Mutual labels:  apple, freakycoder
react-native-redux-boilerplate
React Native Redux Boiler Plate
Stars: ✭ 38 (+46.15%)
Mutual labels:  front-end, freakycoder
react-native-single-select
Customizable & Easy to Use Single Select Library for React Native
Stars: ✭ 74 (+184.62%)
Mutual labels:  front-end, apple
libraries-list
📋 Uma lista de bibliotecas mais usadas para frameworks front-end
Stars: ✭ 23 (-11.54%)
Mutual labels:  development, front-end
punic
Punic is a remote cache CLI built for Carthage and Apple .xcframework
Stars: ✭ 25 (-3.85%)
Mutual labels:  apple
Learning-Core-Audio-Swift-SampleCode
Swift sample code for the book, Learning Core Audio. The original sample code was written in C/Objective-C but I tried to make it in Swift version.
Stars: ✭ 114 (+338.46%)
Mutual labels:  apple

React Native Bounceable

Battle Tested ✅

Animate and bounce any component with RNBounceable for React Native

npm version npm Platform - Android and iOS License: MIT styled with prettier

React Native Bounceable

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.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].