react-native-squish-button

Button with elastic border

Demo

Installation

yarn add react-native-squish-button

or

npm install react-native-squish-button

Dependencies

---

This library depends on react-native-reanimated, react-native-gesture-handler, react-native-svg. Please, install these beforehand.

Usage

import { SquishButton } from 'react-native-squish-button';

// ...

<SquishButton
    width={300}
    height={100}
    color="#4E5372"
    squish={7}
    radius={5}
    text="hello"
    textStyle={{
        color: 'white',
        fontFamily: 'Helvetica',
        fontWeight: 'bold',
        fontSize: 16,
    }}
/>

Props

Name	description	type	required
text	Svg Text from react-native-svg	string	Yes
textStyle	color, fontFamily, fontWeight, fontSize for svg text	style Object	Yes
squish	Intensity of squish	number	Yes
height	Height of button	number	Yes
width	Width of button	number	Yes
radius	Radius of button	number	Yes
color	Background color of the button	string	Yes
spacing	⚠️ This is only for internal calculation	number	No

Contributing

Help me make this library great.

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

Social