Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/nHiRanZ/react-native-kenburns-view

KenBurns Image Effect for React Native Applications
https://github.com/nHiRanZ/react-native-kenburns-view

Last synced: about 1 month ago
JSON representation

KenBurns Image Effect for React Native Applications

Awesome Lists containing this project

README

        

# react-native-kenburns-view



react-native-kenburns-view is released under the ISC license.


Current npm package version.


Follow @nHiRanZ

[`KenBurns`](https://en.wikipedia.org/wiki/Ken_Burns_effect) Image Effect for React Native. Based on Image Component [`Image` Component](https://facebook.github.io/react-native/docs/image.html).
Version: 4.1.0

Tested on React Native 0.62.2 iOS and Android.

## Installation

Note: Requires React Timeout. If it's not available, install it from the command below.
```bash
$ npm i react-timeout --save
```

The proceed to install the library
```bash
$ npm i react-native-kenburns-view --save
```

## Demo/Example

![kenburns view demo](https://media.giphy.com/media/xTcnT8ju8pHKhIZY9G/giphy.gif)

Go to `react-native-kenburns-view/example/KenBurnsExample` to view the example.

## Usage

```jsx

```

## API (props)

| Prop | Description |
|---|---|
|**`tension`**| `int` Tension Value. |
|**`friction`**| `int` Friction Value. |
|**`imageWidth`**| `int` Image Width. |
|**`imageHeight`**| `int` Image Height. |
|**`sourceUri`**| `URI String` Image URL. |
|**`placeholderSource`**| `URI String` Placeholder Image URL (Possibly a Local Image). |
|**`autoStart`**| `boolean` Autostarts the animation. |

## npm

Link: [`react-native-kenburns-view on npm`](https://www.npmjs.com/package/react-native-kenburns-view)

## License

[`ISC`](http://opensource.org/licenses/ISC) License

## Feedback

Email: [email protected]
Twitter: [`nHiRanZ on Twitter`](https://twitter.com/nHiRanZ)