https://github.com/expo/react-apple-easing
Apple's default Core Animation easing functions for React
https://github.com/expo/react-apple-easing
Last synced: 6 months ago
JSON representation
Apple's default Core Animation easing functions for React
- Host: GitHub
- URL: https://github.com/expo/react-apple-easing
- Owner: expo
- License: mit
- Created: 2015-07-09T00:09:20.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2015-07-09T01:55:44.000Z (about 10 years ago)
- Last Synced: 2025-04-08T12:09:44.251Z (6 months ago)
- Language: JavaScript
- Size: 129 KB
- Stars: 89
- Watchers: 19
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# AppleEasing
AppleEasing exports easing functions that are configured to match Core Animation's timing functions. They are generally tasteful and probably make sense to use on both iOS and Android.
**This library is currently supported only on React Native.**
## Installation
```
npm install react-apple-easing
```
## Usage
The easing functions can be used with any library that pass in the elapsed time and expect an eased value back. For example, with the [Animated](https://facebook.github.io/react-native/docs/animations.html#animated) library you could write:
```js
let AppleEasing = require('react-apple-easing');
new Animated.Value(0).timing({
easing: AppleEasing.default,
duration: 250,
}).start();
```
These are the supported easing functions:
| Core Animation constant | AppleEasing function |
|-------------------------------------|----------------------|
| kCAMediaTimingFunctionLinear | None |
| kCAMediaTimingFunctionEaseIn | `easeIn` |
| kCAMediaTimingFunctionEaseOut | `easeOut` |
| kCAMediaTimingFunctionEaseInEaseOut | `easeInOut` |
| kCAMediaTimingFunctionDefault | `default` |
## Note
This project is not affiliated with Apple, Inc.