diff --git a/Actions.js b/Actions.js
index 8bf54ecd3..58f2beb56 100644
--- a/Actions.js
+++ b/Actions.js
@@ -126,39 +126,31 @@ class Actions {
         if (!this.currentRouter){
             throw new Error("No current router is set");
         }
-        if (num > 1){
-            for (let i=0;i<num;i++){
-                if (!this.pop()){
-                    return false;
-                }
-            }
-            return true;
-        } else {
-            let router: BaseRouter = this.currentRouter;
-            debug("Pop, router="+router.name+" stack length:"+router.stack.length);
-            debug("Current route="+router.currentRoute.name+" type="+router.currentRoute.type);
-            while (router.stack.length <= 1 || router.currentRoute.type === 'switch'){
-                if (router.parentRoute) {
-                  router = router.parentRoute.parent;
-                  debug("Switching to parent router="+router.name);
-                } else {
-                  break;
-                }
+     
+        let router: BaseRouter = this.currentRouter;
+        debug("Pop, router="+router.name+" stack length:"+router.stack.length);
+        debug("Current route="+router.currentRoute.name+" type="+router.currentRoute.type);
+        while (router.stack.length <= 1 || router.currentRoute.type === 'switch'){
+            if (router.parentRoute) {
+              router = router.parentRoute.parent;
+              debug("Switching to parent router="+router.name);
+            } else {
+              break;
             }
+        }
+        if (router.delegate.props && router.delegate.props.dispatch){
+            router.delegate.props.dispatch({...props, type: BEFORE_POP, route:router.currentRoute, name:router.currentRoute.name})
+        }
+        if (router.pop(num, props)){
+            this.currentRouter = router;
             if (router.delegate.props && router.delegate.props.dispatch){
-                router.delegate.props.dispatch({...props, type: BEFORE_POP, route:router.currentRoute, name:router.currentRoute.name})
-            }
-            if (router.pop(1, props)){
-                this.currentRouter = router;
-                if (router.delegate.props && router.delegate.props.dispatch){
-                    router.delegate.props.dispatch({...props, type: AFTER_POP, route:router.currentRoute, name:router.currentRoute.name})
-                }
-                return true;
-            } else {
-                return false;
+                router.delegate.props.dispatch({...props, type: AFTER_POP, route:router.currentRoute, name:router.currentRoute.name})
             }
-
+            return true;
+        } else {
+            return false;
         }
+
     }
 }
 const actions = new Actions();
diff --git a/Animations.js b/Animations.js
index fb67e0e42..3b1a207fe 100644
--- a/Animations.js
+++ b/Animations.js
@@ -4,13 +4,8 @@ import buildStyleInterpolator from 'react-native/Libraries/Utilities/buildStyleI
 
 var NoTransition = {
     opacity: {
-        from: 1,
-        to: 1,
-        min: 1,
-        max: 1,
-        type: 'linear',
-        extrapolate: false,
-        round: 100,
+        value: 1.0,
+        type: 'constant',
     },
 };
 
@@ -145,4 +140,4 @@ const Animations = {
     }
 }
 
-export default Animations;
\ No newline at end of file
+export default Animations;
diff --git a/ExRouter.js b/ExRouter.js
index 436f33a28..4bc9541ff 100644
--- a/ExRouter.js
+++ b/ExRouter.js
@@ -82,8 +82,9 @@ export class ExRouteAdapter {
     }
 
     getTitle() {
-        debug("TITLE ="+this.route.title+" for route="+this.route.name);
-        return this.title || "";
+        const title = this.route.props.title || this.title || "";
+        debug("TITLE ="+title+" for route="+this.route.name);
+        return title;
     }
 
     getBackButtonTitle(navigator, index, state){
@@ -160,21 +161,26 @@ export class ExRouteAdapter {
         }
     }
 }
-class ExNavigatorBar extends React.Component {
+class ExNavigationBar extends Navigator.NavigationBar {
+    constructor(props){
+        super(props);
+        this.state = {};
+    }
     render(){
         const route = this.props.router.nextRoute || this.props.router.currentRoute;
-        const renderNavBar = (route.component && route.component.renderNavigationBar) || route.renderNavigationBar || this.props.renderNavigationBar || (props=><Navigator.NavigationBar {...props}/>);
-        const navBar = renderNavBar(this.props);
+        const renderNavBar = (route.component && route.component.renderNavigationBar) || route.renderNavigationBar  || this.props.router.renderNavigationBar || this.props.renderNavigationBar;
+        let res = renderNavBar ? renderNavBar(this.props) : super.render();
 
         if (route.props.hideNavBar === false){
-            return navBar;
+            return res;
         }
         if (this.props.router.props.hideNavBar || route.props.hideNavBar){
             return null;
         }
-        return navBar;
+        return res;
     }
 }
+
 export default class ExRouter extends React.Component {
     router: BaseRouter;
 
@@ -186,11 +192,12 @@ export default class ExRouter extends React.Component {
         this.onReplace = this.onReplace.bind(this);
         this.onJump = this.onJump.bind(this);
         this.onActionSheet = this.onActionSheet.bind(this);
+        this.onTransitionToTop = this.onTransitionToTop.bind(this);
         this.state = {};
     }
 
     componentWillUnmount() {
-        if (this === Actions.currentRouter.delegate) {
+        if (Actions.currentRouter && this === Actions.currentRouter.delegate) {
             Actions.currentRouter = null;
         }
     }
@@ -265,7 +272,37 @@ export default class ExRouter extends React.Component {
                 return false;
             }
         }
-        this.refs.nav.pop();
+
+        if (num === 1) {
+            this.refs.nav.pop();
+        } else {
+            this.refs.nav.popBack(num);
+        }
+        return true;
+    }
+
+    onTransitionToTop(route:Route, props:{ [key: string]: any}) {
+        if (this.props.onTransitionToTop) {
+            const res = this.props.onTransitionToTop(route, props);
+            if (!res) {
+                return false;
+            }
+        }
+        const navigator = this.refs.nav;
+        let router:BaseRouter = route.parent;
+
+        // reset router stack
+        router._stack = [route.name];
+
+        // you can use navigator.transitionToTop or  navigator.immediatelyResetRouteStack + navigator.push
+        // navigator.immediatelyResetRouteStack + navigator.push is more beter ,
+        // if target route's parent(router) stack only have one route  eg ['someroute']
+
+        //navigator.transitionToTop(new ExRouteAdapter(route, props));
+
+        navigator.immediatelyResetRouteStack([]);
+        navigator.push(new ExRouteAdapter(route, props));
+
         return true;
     }
 
@@ -287,32 +324,17 @@ export default class ExRouter extends React.Component {
         this.refs.actionsheet.showActionSheetWithOptions({...route.props, ...props}, props.callback);
     }
 
-    _renderNavigationBar(props){
-        const route = this.props.router.nextRoute || this.props.router.currentRoute;
-        console.log("ROUTE:"+route.name);
-        const renderNavBar = (route.component && route.component.renderNavigationBar) || route.renderNavigationBar || this.props.renderNavigationBar || (props=><Navigator.NavigationBar {...props}/>);
-        const navBar = renderNavBar(props);
-
-        if (route.props.hideNavBar === false){
-            return navBar;
-        }
-        if (this.props.router.props.hideNavBar || route.props.hideNavBar){
-            return null;
-        }
-        return navBar;
-
-    }
-
     render() {
         const router = this.props.router;
+        const route = this.props.router.nextRoute || this.props.router.currentRoute;
         if (!router){
             throw new Error("No router is defined");
         }
         const Header = this.props.header;
-        const header = Header ? <Header {...this.props} {...this.state}/> : null;
+        const header = Header ? <Header {...this.props} {...route.props} {...this.state}/> : null;
 
         const Footer = this.props.footer;
-        const footer = Footer ? <Footer {...this.props} {...this.state}/> : null;
+        const footer = Footer ? <Footer {...this.props} {...route.props} {...this.state}/> : null;
 
         const routerViewStyle = this.props.routerViewStyle || {};
 
@@ -330,7 +352,7 @@ export default class ExRouter extends React.Component {
                         style={styles.transparent}
                         sceneStyle={{ paddingTop: 0, backgroundColor:'transparent' }}
                         {...this.props}
-                        renderNavigationBar={props=><ExNavigatorBar {...this.props} {...props} {...this.state} router={router}/>}
+                        renderNavigationBar={props=><ExNavigationBar {...this.props} {...props} {...this.state} router={router}/>}
                     />
                     {footer}
                     {this.state.modal}
diff --git a/Example/.flowconfig b/Example/.flowconfig
index 245c23a05..c3edaf946 100644
--- a/Example/.flowconfig
+++ b/Example/.flowconfig
@@ -51,15 +51,15 @@ module.system=haste
 munge_underscores=true
 
 module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
-module.name_mapper='^[./a-zA-Z0-9$_-]+\.png$' -> 'RelativeImageStub'
+module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\)$' -> 'RelativeImageStub'
 
 suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
 suppress_type=$FixMe
 
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-0]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-0]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-1]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-1]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
 
 [version]
-0.20.1
+0.21.0
diff --git a/Example/Example.js b/Example/Example.js
index e754813a0..5c307e1ca 100644
--- a/Example/Example.js
+++ b/Example/Example.js
@@ -83,7 +83,7 @@ export default class Example extends React.Component {
                     <Route name="error" type="modal" component={Error}/>
                     <Route name="modalBox" type="modal" component={ReactNativeModalBox}/>
                     <Route name="tabbar">
-                        <Router footer={TabBar} showNavigationBar={false}>
+                        <Router footer={TabBar} hideNavBar={true}>
                             <Route name="tab1" schema="tab" title="Tab #1" >
                                 <Router onPop={()=>{console.log("onPop is called!"); return true} }>
                                     <Route name="tab1_1" component={TabView} title="Tab #1_1" />
@@ -106,4 +106,4 @@ export default class Example extends React.Component {
             </Provider>
         );
     }
-}
\ No newline at end of file
+}
diff --git a/Example/android/app/build.gradle b/Example/android/app/build.gradle
index 8a6707902..424557301 100644
--- a/Example/android/app/build.gradle
+++ b/Example/android/app/build.gradle
@@ -60,7 +60,8 @@ import com.android.build.OutputFile
 apply from: "react.gradle"
 
 /**
- * Set this to true to create two separate APKs instead of one:
+ * Set this to true to create three separate APKs instead of one:
+ *   - A universal APK that works on all devices
  *   - An APK that only works on ARM devices
  *   - An APK that only works on x86 devices
  * The advantage is the size of the APK is reduced by about 4MB.
@@ -72,7 +73,7 @@ def enableSeparateBuildPerCPUArchitecture = false
 /**
  * Run Proguard to shrink the Java bytecode in release builds.
  */
-def enableProguardInReleaseBuilds = true
+def enableProguardInReleaseBuilds = false
 
 android {
     compileSdkVersion 23
@@ -91,7 +92,7 @@ android {
     splits {
         abi {
             enable enableSeparateBuildPerCPUArchitecture
-            universalApk false  // Also generate an universal APK
+            universalApk false
             reset()
             include "armeabi-v7a", "x86"
         }
@@ -120,5 +121,5 @@ android {
 dependencies {
     compile fileTree(dir: "libs", include: ["*.jar"])
     compile "com.android.support:appcompat-v7:23.0.1"
-    compile "com.facebook.react:react-native:0.19.+"
+    compile "com.facebook.react:react-native:0.20.+"
 }
diff --git a/Example/android/app/proguard-rules.pro b/Example/android/app/proguard-rules.pro
index 35840261d..7d72e4692 100644
--- a/Example/android/app/proguard-rules.pro
+++ b/Example/android/app/proguard-rules.pro
@@ -42,8 +42,8 @@
 -keep class * extends com.facebook.react.bridge.NativeModule { *; }
 -keepclassmembers,includedescriptorclasses class * { native <methods>; }
 -keepclassmembers class *  { @com.facebook.react.uimanager.UIProp <fields>; }
--keepclassmembers class *  { @com.facebook.react.uimanager.ReactProp <methods>; }
--keepclassmembers class *  { @com.facebook.react.uimanager.ReactPropGroup <methods>; }
+-keepclassmembers class *  { @com.facebook.react.uimanager.annotations.ReactProp <methods>; }
+-keepclassmembers class *  { @com.facebook.react.uimanager.annotations.ReactPropGroup <methods>; }
 
 -dontwarn com.facebook.react.**
 
diff --git a/Example/package.json b/Example/package.json
index 863f9b147..144e0aa9d 100644
--- a/Example/package.json
+++ b/Example/package.json
@@ -8,7 +8,7 @@
   "dependencies": {
     "react-native": "^0.20.0",
     "react-native-button": "^1.2.1",
-    "react-native-router-flux": "^2.3.5",
+    "react-native-router-flux": "^2.3.9",
     "react-native-modalbox": "^1.3.0",
     "react-redux": "^4.4.0",
     "redux": "^3.3.1"
diff --git a/README.md b/README.md
index 765418f48..3f25b2532 100644
--- a/README.md
+++ b/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`, `modal`,`actionSheet`,`replace`, `switch`, `reset`.  Default is 'push'. `replace` tells navigator to replace current route with new route. `actionSheet` shows Action Sheet popup, you must pass callback as callback function, check Example for details. `modal` type inserts its 'component' after navigator component. It could be used for popup alerts as well for various needed processes before any navigator transitions (like login auth process).``switch` is used for tab screens. `reset` is similar to replace except it unmounts the componets in the navigator stack. `modal` component could be dismissed by using Actions.dismiss() |
+| type | string | optional | Defines how the new screen is added to the navigator stack. One of `push`, `modal`,`actionSheet`,`replace`, `switch`, `reset` `transitionToTop`.  Default is 'push'. `replace` tells navigator to replace current route with new route. `actionSheet` shows Action Sheet popup, you must pass callback as callback function, check Example for details. `modal` type inserts its 'component' after navigator component. It could be used for popup alerts as well for various needed processes before any navigator transitions (like login auth process).``switch` is used for tab screens. `reset` is similar to replace except it unmounts the componets in the navigator stack. `modal` component could be dismissed by using Actions.dismiss() `transitionToTop` will reset router stack ['route.name'] and with animation, if route has `sceneConfig`. eg `<Route name="login" schema="modal" component={Login} type="transitionToTop" />` |
 | 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 |
@@ -112,8 +112,8 @@ export default class Example extends React.Component {
                 <Route name="error" component={Error} title="Error"  type="modal"/>
                 <Route name="register2" component={Register} title="Register2"  schema="withoutAnimation"/>
                 <Route name="tabbar">
-                    <Router footer={TabBar} showNavigationBar={false} tabBarStyle={{borderTopColor:'#00bb00',borderTopWidth:1,backgroundColor:'white'}}>
-                        <Route name="tab1" schema="tab" title="Tab #1" >
+                    <Router footer={TabBar} hideNavBar={true} tabBarStyle={{borderTopColor:'#00bb00',borderTopWidth:1,backgroundColor:'white'}}>
+                        <Route name="tab1" schema="tab" title="Tab #1" defaultRoute='tab1_1'>
                             <Router>
                                 <Route name="tab1_1" component={TabView} title="Tab #1_1" />
                                 <Route name="tab1_2" component={TabView} title="Tab #1_2" />
@@ -325,7 +325,7 @@ You also can do many other interesting things from here, like saving an history
 
 **4. Update your component on focus**  
 I'm doing it on `componentDidUpdate` of my component of the route named `payment`.
-If `global.currentRoute` is `payment` and the previous `global.currentRoute` was different, than the component has just been focused.
+If `global.currentRoute` is `payment` and the previous `global.currentRoute` was different, then the component has just been focused.
 ```javascript
   componentDidUpdate(prevProps) {
     const prevRoute = prevProps.global.currentRoute
diff --git a/TabBar.js b/TabBar.js
index debef51be..b8b8d8ebd 100644
--- a/TabBar.js
+++ b/TabBar.js
@@ -8,8 +8,11 @@ export default class TabBar extends React.Component {
         if (!Actions[el.props.name]){
             throw new Error("No action is defined for name="+el.props.name+" actions:"+JSON.stringify(Object.keys(Actions)));
         }
-        Actions[el.props.name]({hideTabBar: el.props.hideTabBar});
-
+        if (this.props.selected == el.props.name && Actions[el.props.defaultRoute]) {
+            Actions[el.props.defaultRoute]({hideTabBar: el.props.hideTabBar});
+        } else {
+            Actions[el.props.name]({hideTabBar: el.props.hideTabBar});
+        }
     }
     render(){
         if (this.props.hideTabBar){
diff --git a/package.json b/package.json
index b512dfa34..9d8e2595c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-native-router-flux",
-  "version": "2.3.6",
+  "version": "2.3.11",
   "description": "React Native Router using Flux architecture",
   "repository": {
     "type": "git",