status-im/react-navigation
2
0
Fork 0
mirror of https://github.com/status-im/react-navigation.git synced 2025-02-24 17:18:09 +00:00
Code Issues Projects Releases Wiki Activity

Fix incorrect easing functions for CardStack (#3381)

Browse Source 
* Fix invalid easing functions for CardStack

1. `timing` function accepts `TimingAnimationConfig` which expect `easing` (or dont expect at all) function with following signature: `(value: number) => number`
2. under the hood, `TimingAnimation` falls back to `easeInOut` function, if `easing` is not specified
`this._easing = config.easing !== undefined ? config.easing : easeInOut();`
3. by mistake passing `Easing.linear()` results in following
`typeof Easing.linear(); // undefined` which makes statement in step 2 fall back to `easeInOut`

This commit makes passing `easeInOut` function explicit and fixes existing issue and several Flow warnings

* Do not memoize easing function, keep things simple
This commit is contained in:
Andrej Badin 2018-02-05 19:42:45 +01:00 committed by Brent Vatne
parent 154aa85f70
commit 63a6565afa
1 changed files with 4 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/CardStack/CardStack.js
View File

@ -22,6 +22,8 @@ import TransitionConfigs from './TransitionConfigs';
const emptyFunction = () => {}; const emptyFunction = () => {};
const EaseInOut = Easing.inOut(Easing.ease);
/** /**
* The max duration of the card animation in milliseconds after released gesture. * The max duration of the card animation in milliseconds after released gesture.
* The actual duration should be always less then that because the rest distance * The actual duration should be always less then that because the rest distance
@ -160,7 +162,7 @@ class CardStack extends React.Component {
Animated.timing(this.props.position, { Animated.timing(this.props.position, {
toValue: resetToIndex, toValue: resetToIndex,
duration, duration,
easing: Easing.linear(), easing: EaseInOut,
useNativeDriver: this.props.position.__isNative, useNativeDriver: this.props.position.__isNative,
}).start(); }).start();
} }
@ -176,7 +178,7 @@ class CardStack extends React.Component {
Animated.timing(position, { Animated.timing(position, {
toValue, toValue,
duration, duration,
easing: Easing.linear(), easing: EaseInOut,
useNativeDriver: position.__isNative, useNativeDriver: position.__isNative,
}).start(() => { }).start(() => {
this._immediateIndex = null; this._immediateIndex = null;