https://github.com/cawfree/react-native-animated-look-up-table

Creates a look up table which can be used to interpolate across the results of an arbitrary function.
https://github.com/cawfree/react-native-animated-look-up-table

animated function look lut react react-native table up

Last synced: about 1 month ago
JSON representation

Creates a look up table which can be used to interpolate across the results of an arbitrary function.

• Host: GitHub
• URL: https://github.com/cawfree/react-native-animated-look-up-table
• Owner: cawfree
• License: mit
• Created: 2019-11-13T13:39:40.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2019-12-16T08:40:11.000Z (over 5 years ago)
• Last Synced: 2025-03-18T13:11:16.320Z (2 months ago)
• Topics: animated, function, look, lut, react, react-native, table, up
• Language: JavaScript
• Size: 12.7 KB
• Stars: 5
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-native-animated-look-up-table

Creates a look up table which can be used to interpolate across the results of an arbitrary input function. This can be used to help achieve some complex effects whilst maintaining performance, since they can be used in conjunction with [`useNativeDriver`](https://facebook.github.io/react-native/docs/animated#using-the-native-driver).

Check out the deep dive [here](http://cawfree.com/react-native-animated-look-up-table/).

## 🚀 Getting Started

Using [`npm`]():

```sh

npm install --save react-native-animated-look-up-table

```

Using [`yarn`]():

```sh

yarn add react-native-animated-look-up-table

```

## ✍️ Usage

This library exports the function [`createTransform`](https://github.com/cawfree/react-native-animated-look-up-table/blob/77a4cac00ce4865abb56c30c528f98ee2e85d4b9/index.js#L1), which can be used to compile your animated look up table:

```javascript

import { createTransform } from 'react-native-animated-transform';

// XXX: Create a sine wave between [0, 1] using 1024 samples.

const sine = createTransform(

  // Any arbitrary function of the form (p, from, to) => n can be used.

  // The value of p is your current value of progression between

  // "from" and "to".

  Math.sin, 

  {

    from: 0,

    to: 2 * Math.PI,

    samples: 1024,

  },

);

```

Once generated, you can pass this to an [`Animated.Value`](https://facebook.github.io/react-native/docs/animated)'s `interpolate` function:

```javascript

```

Since we're interpolating between samples, your look up table will smoothly transition between defined entries of your complex function.

## ✌️  License

[MIT](https://opensource.org/licenses/MIT)