# @ericedouard/react-native-easy-view-transformer

> An easy and simple to use React Native component to transform and translate a view with gestures like pan, pinch and double tap. Supporting both iOS and Android. Free and made possible along with costly maintenance and updates by [Lue Hang](https://www.f

Latest version **1.2.2** (published 2020-06-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install @ericedouard/react-native-easy-view-transformer
pnpm add @ericedouard/react-native-easy-view-transformer
yarn add @ericedouard/react-native-easy-view-transformer
bun add @ericedouard/react-native-easy-view-transformer
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.2 |
| Published | 2020-06-13 |
| First published | 2020-06-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 32.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Lue Hang |
| Maintainers | ericedouard |
| Keywords | react-native-easy-view-transformer, react-native, config, zoom in, zoom out, double tap, panning, over scroll distance, over scroll resistance, on pinch, on single tap, scaling, view, transform, translate, images, ios, android, LueHsoft, LueH LABS, Lue Hang, luehang |

## Links

- npm: https://www.npmjs.com/package/@ericedouard/react-native-easy-view-transformer
- Repository: https://github.com/ericedouard/react-native-easy-view-transformer
- Homepage: https://luehangs.site/lue_hang/projects/react-native-easy-view-transformer
- Issues: https://github.com/Luehang/react-native-easy-view-transformer/issues
- npm.io page: https://npm.io/package/@ericedouard/react-native-easy-view-transformer

## Dependencies (3)

- [prop-types](https://npm.io/package/prop-types.md) ^15.6.2
- [react-native-scrolling](https://npm.io/package/react-native-scrolling.md) ^1.0.2
- [react-native-easy-guesture-responder](https://npm.io/package/react-native-easy-guesture-responder.md) ^1.1.2

## Alternatives

- [jsforce](https://npm.io/package/jsforce.md) — 851.2K weekly downloads
- [react-native-qrcode-svg](https://npm.io/package/react-native-qrcode-svg.md) — 693.5K weekly downloads
- [@salesforce/plugin-data](https://npm.io/package/@salesforce/plugin-data.md) — 394.9K weekly downloads
- [@backstage/plugin-search-common](https://npm.io/package/@backstage/plugin-search-common.md) — 308.5K weekly downloads
- [@chain-registry/types](https://npm.io/package/@chain-registry/types.md) — 38.4K weekly downloads

## Recent versions

- 1.2.2 (latest) — 2020-06-13
- 1.2.1 — 2020-06-13

## README

<a href="https://luehangs.site"><img src="https://luehangs.site/images/lh-blog-strip.jpg" alt="LueHsoft LueH LABS Lue Hang luehang"/></a>
<br/>
<br/>

<h1 align="center">
    React Native Easy View Transformer
</h1>

An easy and simple to use React Native component to transform and translate a view with gestures like pan, pinch and double tap.  Supporting both iOS and Android.  Check out the [docs](https://www.luehangs.site/lue_hang/projects/react-native-easy-view-transformer).

- Supports pinch, double tap or pull.
- Includes guestures and important event listeners for pan, pinch, single tap and double tap.
- Easy to use.  Just wrap any view in `<ViewTransformer></ViewTransformer>`.
- Won't capture children's press.
- Won't capture children's scroll, if children don't allow.
- Supports both iOS and Android.

<br/>

---
<br/>

<h1 align="center">
    <a href="https://www.luehangs.site/lue_hang/projects/react-native-easy-view-transformer">
        <img src="https://www.luehangs.site/videos/react-native-easy-view-transformer-demo.gif" alt="react-native-easy-view-transformer"/>
    </a>
</h1>

<br/>
<br/>

# :link: Quick Links
- [Documentation](https://www.luehangs.site/lue_hang/projects/react-native-easy-view-transformer)
- [Mobile Kit Marketplace](https://luehangs.site/marketplace/mobile-development)
- [React Native Development How To Dos](https://luehangs.site/blogs/react-native-development)
- [Chat](https://luehangs.site)

<br/>

---
<br/>

# :gem: Install

Type in the following to the command line to install the module.

```bash
$ npm install --save react-native-easy-view-transformer
```

or

```bash
$ yarn add react-native-easy-view-transformer
```

<br/>
<br/>
<br/>

---
<br/>
<br/>
<br/>

## :tada: Usage Example

Add an ``import`` to the top of the file.  At minimal, wrap any view in the `<ViewTransformer></ViewTransformer>`.

> If you like [`react-native-easy-view-transformer`](https://github.com/Luehang/react-native-easy-view-transformer), please be sure to give it a star at [GitHub](https://github.com/Luehang/react-native-easy-view-transformer). Thanks.

```javascript
import ViewTransformer from "react-native-easy-view-transformer";

//...
render() {
    return (
        <ViewTransformer
            maxScale={2} // 2 times zoom
        >
            {/* Any kind of view. */}
        </ViewTransformer>
    );
}
//...
```

<br/>

---
<br/>

# :book: Full Documentation

<p>Learn more about the installation and how to use this package in the updated <a href="https://www.luehangs.site/lue_hang/projects/react-native-easy-view-transformer" target="_blank">documentation</a> page.</p>

<br/>
<br/>
<br/>

---
<br/>
<br/>
<br/>

## :santa: Author

<a href="https://www.facebook.com/lue.hang">
<img src="https://www.luehangs.site/images/lue-hang2018-circle-150px.png"/>
</a>

Free and made possible along with costly maintenance and updates by [Lue Hang](https://www.facebook.com/lue.hang) (the author).

<br/>
<br/>
<br/>

---
<br/>
<br/>
<br/>

## :clap: Contribute

[Pull requests](https://github.com/Luehang/react-native-easy-view-transformer/pulls) are welcomed.

<br/>

### :tophat: Contributors

Contributors will be posted here.

<br/>

### :baby: Beginners

Not sure where to start, or a beginner? Take a look at the [issues page](https://github.com/Luehang/react-native-easy-view-transformer/issues).

<br/>
<br/>
<a href="https://luehangs.site/marketplace/product/RN%20Posting%20Demo%20App%20Kit"><img src="https://luehangs.site/images/lh-mobile-strip.jpg" alt="LueHsoft LueH LABS Lue Hang luehang"/></a>
<br/>
<br/>

## :page_facing_up: License

MIT © [Lue Hang](https://luehangs.site), as found in the LICENSE file.

---
_Source: https://npm.io/package/@ericedouard/react-native-easy-view-transformer · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._