Permalink
Browse files

Navigator - Fix wrong scene transformation after pop

Summary:
Fixes #9485
Closes #9516

Differential Revision: D4080618

Pulled By: lacker

fbshipit-source-id: 296c209a0438c4a06b3b3556d7084c5435d60c72
  • Loading branch information...
1 parent f9e36a0 commit f64538943e180adc2180d89285fab6727eaf3982 @sooth-sayer sooth-sayer committed with Facebook Github Bot Oct 26, 2016
Showing with 29 additions and 7 deletions.
  1. +29 −7 Libraries/CustomComponents/Navigator/Navigator.js
@@ -102,6 +102,15 @@ var styles = StyleSheet.create({
right: 0,
bottom: 0,
top: 0,
+ transform: [
+ {translateX: 0},
+ {translateY: 0},
+ {scaleX: 1},
+ {scaleY: 1},
+ {rotate: '0deg'},
+ {skewX: '0deg'},
+ {skewY: '0deg'},
+ ],
},
baseScene: {
position: 'absolute',
@@ -397,6 +406,8 @@ var Navigator = React.createClass({
this._renderedSceneMap = new Map();
+ this._sceneRefs = [];
+
var routeStack = this.props.initialRouteStack || [this.props.initialRoute];
invariant(
routeStack.length >= 1,
@@ -669,8 +680,8 @@ var Navigator = React.createClass({
* Push a scene off the screen, so that opacity:0 scenes will not block touches sent to the presented scenes
*/
_disableScene: function(sceneIndex) {
- this.refs['scene_' + sceneIndex] &&
- this.refs['scene_' + sceneIndex].setNativeProps(SCENE_DISABLED_NATIVE_PROPS);
+ this._sceneRefs[sceneIndex] &&
+ this._sceneRefs[sceneIndex].setNativeProps(SCENE_DISABLED_NATIVE_PROPS);
},
/**
@@ -693,8 +704,13 @@ var Navigator = React.createClass({
// to prevent the enabled scene from flashing over the presented scene
enabledSceneNativeProps.style.opacity = 0;
}
- this.refs['scene_' + sceneIndex] &&
- this.refs['scene_' + sceneIndex].setNativeProps(enabledSceneNativeProps);
+ this._sceneRefs[sceneIndex] &&
+ this._sceneRefs[sceneIndex].setNativeProps(enabledSceneNativeProps);
+ },
+
+ _clearTransformations: function(sceneIndex) {
+ const defaultStyle = flattenStyle([styles.defaultSceneStyle]);
+ this._sceneRefs[sceneIndex].setNativeProps({ style: defaultStyle });
},
_onAnimationStart: function() {
@@ -726,7 +742,7 @@ var Navigator = React.createClass({
},
_setRenderSceneToHardwareTextureAndroid: function(sceneIndex, shouldRenderToHardwareTexture) {
- var viewAtIndex = this.refs['scene_' + sceneIndex];
+ var viewAtIndex = this._sceneRefs[sceneIndex];
if (viewAtIndex === null || viewAtIndex === undefined) {
return;
}
@@ -968,7 +984,7 @@ var Navigator = React.createClass({
},
_transitionSceneStyle: function(fromIndex, toIndex, progress, index) {
- var viewAtIndex = this.refs['scene_' + index];
+ var viewAtIndex = this._sceneRefs[index];
if (viewAtIndex === null || viewAtIndex === undefined) {
return;
}
@@ -1092,6 +1108,10 @@ var Navigator = React.createClass({
var presentedRoute = this.state.routeStack[this.state.presentedIndex];
var popSceneConfig = this.props.configureScene(presentedRoute); // using the scene config of the currently presented view
this._enableScene(popIndex);
+ // This is needed because scene at the pop index may be transformed
+ // with a configuration different from the configuration on the presented
+ // route.
+ this._clearTransformations(popIndex);
this._emitWillFocus(this.state.routeStack[popIndex]);
this._transitionTo(
popIndex,
@@ -1248,7 +1268,9 @@ var Navigator = React.createClass({
return (
<View
key={'scene_' + getRouteID(route)}
- ref={'scene_' + i}
+ ref={(scene) => {
+ this._sceneRefs[i] = scene;
+ }}
onStartShouldSetResponderCapture={() => {
return (this.state.transitionFromIndex != null);
}}

0 comments on commit f645389

Please sign in to comment.