get up to date

Actions.js

@@ -42,13 +42,13 @@ class Actions {
         // check if route is in children, current or parent routers
         let router: Router = this.currentRouter;
 
-        debug("Route to "+name+" current router="+this.currentRouter.name+ " current route="+this.currentRouter.currentRoute.name);
         // deep into child router
-
         while (router.currentRoute.childRouter){
             router = router.currentRoute.childRouter;
             debug("Switching to child router="+router.name);
         }
+
+        debug("Route to "+name+" current router="+this.currentRouter.name+ " current route="+this.currentRouter.currentRoute.name);
         while (!router.routes[name]){
             const route = router.parentRoute;
             if (!route || !route.parent){
@@ -58,6 +58,13 @@ class Actions {
             debug("Switching to router="+router.name);
         }
         if (router.route(name, props)){
+
+            // deep into child router
+            while (router.currentRoute.childRouter){
+                router = router.currentRoute.childRouter;
+                debug("Switching to child router="+router.name);
+            }
+
             this.currentRouter = router;
             return true;
         }

ExRouter.js

@@ -86,6 +86,16 @@ export class ExRouteAdapter {
     }
 
     renderLeftButton(navigator, index, state){
+        if (this.route.props.onLeft && this.route.props.leftTitle) {
+            return (<TouchableOpacity
+              touchRetentionOffset={ExNavigator.Styles.barButtonTouchRetentionOffset}
+              onPress={() => this.route.props.onLeft({...this.route.props, ...this.props})}
+              style={[ExNavigator.Styles.barLeftButton, this.route.props.leftButtonStyle]}>
+                <Text
+                  style={[ExNavigator.Styles.barLeftButtonText, this.route.props.leftButtonTextStyle]}>{this.route.props.leftTitle}</Text>
+            </TouchableOpacity>);
+        }
+
         if (index === 0 || index < navigator.getCurrentRoutes().length-1) {
             return null;
         }
@@ -105,7 +115,7 @@ export class ExRouteAdapter {
                     style={[
             ExNavigatorStyles.barButtonText,
             ExNavigatorStyles.barBackButtonText,
-            this._barButtonTextStyle,
+            navigator.props.barButtonTextStyle,
           ]}
                 >
                     {title}
@@ -120,7 +130,7 @@ export class ExRouteAdapter {
                 <BackIcon
                     style={[
             ExNavigatorStyles.barButtonIcon,
-            this._barButtonIconStyle,
+            navigator.props.barButtonIconStyle,
           ]}
                 />
                 {buttonText}
@@ -263,7 +273,7 @@ export default class ExRouter extends React.Component {
                 <ExNavigator ref="nav" initialRouteStack={router.stack.map(route => new ExRouteAdapter(router.routes[route]))}
                          style={styles.transparent}
                          sceneStyle={{ paddingTop: 0 }}
-                         renderNavigationBar={props=><ExNavigationBar {...props} router={router}/>}
+                         renderNavigationBar={props=><ExNavigationBar navigationStyles={Navigator.NavigationBar.StylesIOS} {...props} router={router}/>}
                     {...this.props}
                 />
                 {footer}

Example/components/Home.js

@@ -5,7 +5,7 @@ var {View, Text, StyleSheet} = React;
 var Button = require('react-native-button');
 var Actions = require('react-native-router-flux').Actions;
 
-class Register extends React.Component {
+class Home extends React.Component {
     render(){
         return (
             <View style={styles.container}>
@@ -35,4 +35,4 @@ var styles = StyleSheet.create({
     },
 });
 
-module.exports = Register;
+module.exports = Home;

README.md

@@ -38,7 +38,7 @@ npm i react-native-router-flux --save
 |-----------|--------|---------|--------------------------------------------|
 | name | string | required | Will be used to call screen transition, for example, `Actions.name(params)`. Must be unique. |
 | component | React.Component | semi-required | The `Component` to be displayed. Not required when defining a nested `Router` or child, see example |
-| type | string | optional | Defines how the new screen is added to the navigator stack. One of `push`, `replace`, `switch`.  Default is 'push'. `replace` tells navigator to replace current route with new route. `switch` is used for tab screens. |
+| type | string | optional | Defines how the new screen is added to the navigator stack. One of `push`, `replace`, `switch`, `reset`.  Default is 'push'. `replace` tells navigator to replace current route with new route. `switch` is used for tab screens. `reset` is similar to replace except it unmounts the componets in the navigator stack. |
 | initial | bool | false | Set to `true` if this is the initial screen |
 | title | string | null | The title to be displayed in the navigation bar |
 | schema | string | optional | Set this property to the name of a previously defined `Schema` to inherit its properties |
@@ -95,7 +95,7 @@ export default class Example extends React.Component {
                 </Route>
                 <Route name="register2" component={Register} title="Register2"  schema="withoutAnimation"/>
                 <Route name="tabbar">
-                    <Router footer={TabBar} showNavigationBar={false}>
+                    <Router footer={TabBar} showNavigationBar={false} tabBarStyle={{borderTopColor:'#00bb00',borderTopWidth:1,backgroundColor:'white'}}>
                         <Route name="tab1" schema="tab" title="Tab #1" >
                             <Router>
                                 <Route name="tab1_1" component={TabView} title="Tab #1_1" />

TabBar.js

@@ -59,7 +59,7 @@ export default class TabBar extends React.Component {
             return <View/>
         }
         return (
-            <Tabs style={{backgroundColor:'white'}} onSelect={this.onSelect.bind(this)} {...this.props}>
+            <Tabs style={[{backgroundColor:'white'}, this.props.tabBarStyle]} onSelect={this.onSelect.bind(this)} {...this.props}>
                 {this.state.children}
             </Tabs>
         );

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-router-flux",
-  "version": "2.0.6",
+  "version": "2.0.9",
   "description": "React Native Router using Flux architecture",
   "main": "index.js",
   "scripts": {