looks like direction and duration are no longer in sync with RN upstr…

…eam, and `applyAnimation`

should be used going forward.

README.md

@@ -102,8 +102,7 @@ class App extends React.Component {
 | type | string | 'push' or 'jump' | Defines how the new screen is added to the navigator stack. One of `push`, `jump`, `replace`, `reset`. If parent container is tabbar (tabs=true), jump will be automatically set.
 | tabs| bool | false | Defines 'TabBar' scene container, so child scenes will be displayed as 'tabs'. If no `component` is defined, built-in `TabBar` is used as renderer. All child scenes are wrapped into own navbar.
 | initial | bool | false | Set to `true` if this is the initial scene |
-| duration | number | 250 | Duration of transition (in ms) |
-| direction | string | 'horizontal' | direction of animation horizontal/vertical |
+| applyAnimation | function | | optional if provided overrides the default spring animation |
 | title | string | null | The title to be displayed in the navigation bar |
 | navBar | React.Component | | optional custom NavBar for the scene. Check built-in NavBar of the component for reference |
 | hideNavBar | bool | false | hides the navigation bar for this scene |
@@ -166,10 +165,10 @@ export default class Example extends React.Component {
             <Scene key="modal" component={Modal} >
                 <Scene key="root" hideNavBar={true}>
                     <Scene key="register" component={Register} title="Register"/>
-                    <Scene key="register2" component={Register} title="Register2" duration={1}/>
+                    <Scene key="register2" component={Register} title="Register2" applyAnimation={(pos, navState) => Animated.timing(pos, {toValue: navState.index, duration: 0}).start()} />
                     <Scene key="home" component={Home} title="Replace" type="replace"/>
                     <Scene key="launch" component={Launch} title="Launch" initial={true} style={{flex:1, backgroundColor:'transparent'}}/>
-                    <Scene key="login" direction="vertical">
+                    <Scene key="login">
                         <Scene key="loginModal" component={Login} schema="modal" title="Login"/>
                         <Scene key="loginModal2" hideNavBar={true} component={Login2} title="Login2"/>
                     </Scene>

src/DefaultRenderer.js

@@ -47,20 +47,21 @@ export default class DefaultRenderer extends Component {
         const selected = navigationState.children[navigationState.index];
         //return <DefaultRenderer key={selected.key} navigationState={selected}/>
 
-        const DEFAULT_DURATION = 250;
-        const stateDuration = navigationState.duration >= 0 ? navigationState.duration : DEFAULT_DURATION;
-        const duration = selected.duration >= 0 ? selected.duration : stateDuration;
+        let applyAnimation = selected.applyAnimation || navigationState.applyAnimation;
+        let style = selected.style || navigationState.style;
+
+        let optionals = {};
+        if (applyAnimation) {
+            optionals.applyAnimation = applyAnimation;
+        }
 
         return (
             <NavigationAnimatedView
                 navigationState={navigationState}
-                style={[styles.animatedView, navigationState.style]}
+                style={[styles.animatedView, style]}
                 renderOverlay={this._renderHeader}
-                direction={navigationState.direction || "horizontal"}
-                setTiming={(pos, navState) =>
-                    Animated.timing(pos, {toValue: navState.index, duration}).start()
-                }
                 renderScene={this._renderCard}
+                {...optionals}
             />
         );
     }
@@ -76,8 +77,8 @@ export default class DefaultRenderer extends Component {
         return (
             <NavigationCard
                 {...props}
+                style={props.scene.navigationState.style}
                 key={"card_" + props.scene.navigationState.key}
-                direction={props.scene.navigationState.direction || "horizontal"}
                 panHandlers={props.scene.navigationState.panHandlers }
                 renderScene={this._renderScene}
             />