status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix animation in fast navigation between scenes 

Summary:
There is a bug in navigation animation:
![-05-2016 16-04-23](https://cloud.githubusercontent.com/assets/3778452/20030228/8d93bc3e-a371-11e6-87d6-2c5c994733b5.gif)
navigation animation from route-2 was awful, route-3 scene appeared without any animation, I pushed above example to 46dd8c93b4.

This bug can be reproduced when user navigates to the next scene immediately after navigation to the current one or when navigating between scenes programmatically (e.g. between loading scene and whatever next scene). I made some investigation and It looks like that `progress` should be reseted before building the new _transitionProps.

The above example after applying this patch:
![-05-2016 16-12-16](https://cloud.githubusercontent.com/assets/3778452/20030259/a800681e-a372-11e6-847a-991d355a5940.gif)
Closes https://github.com/facebook/react-native/pull/10761

Differential Revision: D4226864

Pulled By: mkonicek

fbshipit-source-id: 31dceb6c8e497b2cbd891bbda4cb3add01cbcca0
This commit is contained in:
Timur Gibadullin 2016-11-23 09:43:17 -08:00 committed by Facebook Github Bot
parent 2121527cb8
commit df43cc7f6b
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
Libraries/NavigationExperimental/NavigationTransitioner.js
View File

@ -127,14 +127,16 @@ class NavigationTransitioner extends React.Component<any, Props, State> {
scenes: nextScenes,
};
this._prevTransitionProps = this._transitionProps;
this._transitionProps = buildTransitionProps(nextProps, nextState);
const {
position,
progress,
} = nextState;
progress.setValue(0);
this._prevTransitionProps = this._transitionProps;
this._transitionProps = buildTransitionProps(nextProps, nextState);
// get the transition spec.
const transitionUserSpec = nextProps.configureTransition ?
nextProps.configureTransition(
@ -151,8 +153,6 @@ class NavigationTransitioner extends React.Component<any, Props, State> {
const {timing} = transitionSpec;
delete transitionSpec.timing;
progress.setValue(0);
const animations = [
timing(
progress,