npm.io
1.0.1 • Published 4 years ago

react-native-touchable-scale-reanimated-reanimated

Licence
MIT
Version
1.0.1
Deps
5
Size
11 kB
Vulns
1
Weekly
0
Stars
2
SummaryDependencyVersions

Touchable Scale Reanimated

Hi

Touchable Scale Reanimated is a simple React Native component animated with Reanimated 2 that scale when a gesture is handled

TouchableScale

Getting Started

Prerequisites

Install

npm install react-native-touchable-scale-reanimated

Properties

Touchable Scale Reanimated
Property Type Optional Default Description
style array or object Yes - Style definition of the component we want to render
children array or object No - Component
onPress func Yes - Function to be called when onPress event is handled
scaleValue number Yes 0.95 Set how much you want to scale the component
durationValue number Yes 150 Set the scale duration

Example

You can find an example under the folder /example/button-scale/.

Run installation from here

npm install react-native-touchable-scale-reanimated

Run app with the following command package version

npm start

Here you can find a defined component (ie. Button ), wrapped with the Touchable Scale component:

import React from 'react'
import TouchableScale from "../TouchableScale"

function Button ({ title, type, size, border, onPress }) {

  return (
    <TouchableScale 
      onPress={onPress} 
      style={[ button.button, button[type], button[size], border ? button.border : null ]]}>
      <Text style={[ text.button, text[type]]}>
        {title}
      </Text>
    </TouchableScale>
  )
}

export default Button

made with by ialoig

Keywords

react-nativereanimated2touchablegesture-handler