diff --git a/Examples/UIExplorer/NavigationExperimental/NavigationCompositionExample.js b/Examples/UIExplorer/NavigationExperimental/NavigationCompositionExample.js
index 1c9529aed..049b1f6e0 100644
--- a/Examples/UIExplorer/NavigationExperimental/NavigationCompositionExample.js
+++ b/Examples/UIExplorer/NavigationExperimental/NavigationCompositionExample.js
@@ -38,7 +38,6 @@ const {
CardStack: NavigationCardStack,
Header: NavigationHeader,
Reducer: NavigationReducer,
- View: NavigationView,
} = NavigationExperimental;
@@ -267,7 +266,7 @@ class NavigationCompositionExample extends React.Component {
}
class ExampleMainView extends React.Component {
- _renderScene: NavigationSceneRenderer;
+ _renderScene: Function;
_handleNavigation: Function;
componentWillMount() {
@@ -277,21 +276,19 @@ class ExampleMainView extends React.Component {
render() {
return (
-
+
+ {this._renderScene()}
+
);
}
- _renderScene(props: NavigationSceneRendererProps): ReactElement {
- const {scene} = props;
+ _renderScene(): ReactElement {
+ const {navigationState} = this.props;
+ const childState = navigationState.children[navigationState.index];
return (
);
diff --git a/Libraries/NavigationExperimental/NavigationExperimental.js b/Libraries/NavigationExperimental/NavigationExperimental.js
index 14ecaca14..da03980cf 100644
--- a/Libraries/NavigationExperimental/NavigationExperimental.js
+++ b/Libraries/NavigationExperimental/NavigationExperimental.js
@@ -17,7 +17,6 @@ const NavigationCardStack = require('NavigationCardStack');
const NavigationHeader = require('NavigationHeader');
const NavigationReducer = require('NavigationReducer');
const NavigationStateUtils = require('NavigationStateUtils');
-const NavigationView = require('NavigationView');
const NavigationPropTypes = require('NavigationPropTypes');
const NavigationExperimental = {
@@ -26,7 +25,6 @@ const NavigationExperimental = {
Reducer: NavigationReducer,
// Views
- View: NavigationView,
AnimatedView: NavigationAnimatedView,
// CustomComponents:
diff --git a/Libraries/NavigationExperimental/NavigationView.js b/Libraries/NavigationExperimental/NavigationView.js
deleted file mode 100644
index 6a24564fa..000000000
--- a/Libraries/NavigationExperimental/NavigationView.js
+++ /dev/null
@@ -1,178 +0,0 @@
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- *
- * This source code is licensed under the BSD-style license found in the
- * LICENSE file in the root directory of this source tree. An additional grant
- * of patent rights can be found in the PATENTS file in the same directory.
- *
- * @providesModule NavigationView
- * @flow
- */
-'use strict';
-
-const Animated = require('Animated');
-const React = require('React');
-const StyleSheet = require('StyleSheet');
-const View = require('View');
-const NavigationScenesReducer = require('NavigationScenesReducer');
-const ReactComponentWithPureRenderMixin = require('ReactComponentWithPureRenderMixin');
-
-import type {
- NavigationActionCaller,
- NavigationAnimatedValue,
- NavigationLayout,
- NavigationParentState,
- NavigationScene,
- NavigationSceneRenderer,
- NavigationSceneRendererProps,
-} from 'NavigationTypeDefinition';
-
-type Props = {
- navigationState: NavigationParentState,
- onNavigate: NavigationActionCaller,
- renderScene: NavigationSceneRenderer,
- style: any,
-};
-
-type State = {
- layout: NavigationLayout,
- scenes: Array,
-};
-
-const {PropTypes} = React;
-
-/**
- * A simple view that will render a scene for the currently focused sub-state.
- * The most common use-case is for tabs, where no transition is needed
- */
-class NavigationView extends React.Component {
- _onLayout: (event: any) => void;
- _position: NavigationAnimatedValue;
-
- props: Props;
- state: State;
-
- static propTypes = {
- navigationState: PropTypes.object.isRequired,
- onNavigate: PropTypes.func.isRequired,
- renderScene: PropTypes.func.isRequired,
- };
-
- constructor(props: Props, context: any) {
- super(props, context);
-
- const layout = {
- initWidth: 0,
- initHeight: 0,
- isMeasured: false,
- width: new Animated.Value(0),
- height: new Animated.Value(0),
- };
-
- const {navigationState} = this.props;
-
- this._position = new Animated.Value(navigationState.index);
-
- this.state = {
- layout,
- scenes: NavigationScenesReducer([], navigationState),
- };
- }
-
- shouldComponentUpdate(nextProps: Props, nextState: State): boolean {
- return ReactComponentWithPureRenderMixin.shouldComponentUpdate.call(
- this,
- nextProps,
- nextState
- );
- }
-
- componentWillReceiveProps(nextProps: Props): void {
- if (nextProps.navigationState !== this.props.navigationState) {
- const {navigationState} = nextProps;
- this.setState(
- {
- scenes: NavigationScenesReducer(
- this.state.scenes,
- navigationState,
- null, // There will be no transtion.
- ),
- },
- () => {
- this._position.setValue(navigationState.index);
- },
- );
- }
- }
-
- componentWillMount(): void {
- this._onLayout = this._onLayout.bind(this);
- }
-
- render(): ReactElement {
- const {
- navigationState,
- onNavigate
- } = this.props;
-
- const {
- layout,
- scenes,
- } = this.state;
-
- const sceneProps = {
- layout,
- navigationState: navigationState,
- onNavigate: onNavigate,
- position: this._position,
- scene: scenes[navigationState.index],
- scenes,
- };
-
- return (
-
- {this._renderScene(sceneProps)}
-
- );
- }
-
- _renderScene(props: NavigationSceneRendererProps): ?ReactElement {
-
- const child = this.props.renderScene(props);
- if (child === null) {
- return null;
- }
- return {child};
- }
-
- _onLayout(event: any): void {
- const {height, width} = event.nativeEvent.layout;
-
- const layout = {
- ...this.state.layout,
- initHeight: height,
- initWidth: width,
- isMeasured: true,
- };
-
- layout.height.setValue(height);
- layout.width.setValue(width);
-
- this.setState({ layout });
- }
-}
-
-const styles = StyleSheet.create({
- scene: {
- bottom: 0,
- left: 0,
- position: 'absolute',
- right: 0,
- top: 0,
- },
-});
-
-module.exports = NavigationView;