Fix: The navigation bar duplicates when going to TabView's "More" tab

Resolves #2121

tns-core-modules/ui/frame/frame.d.ts

@@ -346,6 +346,10 @@ declare module "ui/frame" {
          * Use NavBarVisibility enumeration - auto, never, always
          */
         navBarVisibility: string;
+        
+        //@private
+        _disableNavBarAnimation: boolean;
+        //@endprivate
     }
 
     //@private

tns-core-modules/ui/frame/frame.ios.ts

@@ -662,6 +662,10 @@ class iOSFrame implements definition.iOSFrame {
     private _navBarVisibility: string;
     private _frame: Frame;
     
+    // TabView uses this flag to disable animation while showing/hiding the navigation bar because of the "< More" bar.
+    // See the TabView._handleTwoNavigationBars method for more details.
+    public _disableNavBarAnimation: boolean;
+
     constructor(frame: Frame) {
         this._frame = frame;
         this._controller = UINavigationControllerImpl.initWithOwner(new WeakRef(frame));
@@ -681,7 +685,7 @@ class iOSFrame implements definition.iOSFrame {
         var change = this._showNavigationBar !== value;
         this._showNavigationBar = value;
 
-        let animated = !this._frame._isInitialNavigation;
+        let animated = !this._frame._isInitialNavigation && !this._disableNavBarAnimation;
         this._controller.setNavigationBarHiddenAnimated(!value, animated);
 
         let currentPage = this._controller.owner.currentPage;

tns-core-modules/ui/tab-view/tab-view.ios.ts

@@ -9,6 +9,7 @@ import proxy = require("ui/core/proxy");
 import color = require("color");
 import * as imageSourceModule from "image-source";
 import style = require("ui/styling/style");
+import { Page } from "ui/page";
 
 global.moduleMerge(common, exports);
 
@@ -52,10 +53,26 @@ class UITabBarControllerDelegateImpl extends NSObject implements UITabBarControl
         return delegate;
     }
 
+    public tabBarControllerShouldSelectViewController(tabBarController: UITabBarController, viewController: UIViewController): boolean {
+        if (trace.enabled) {
+            trace.write("TabView.delegate.SHOULD_select(" + tabBarController + ", " + viewController + ");", trace.categories.Debug);
+        }
+        
+        let owner = this._owner.get();
+        if (owner) {
+            // "< More" cannot be visible after clicking on the main tab bar buttons.
+            let backToMoreWillBeVisible = false;
+            owner._handleTwoNavigationBars(backToMoreWillBeVisible);
+        }
+        
+        return true;    
+    }
+    
     public tabBarControllerDidSelectViewController(tabBarController: UITabBarController, viewController: UIViewController): void {
         if (trace.enabled) {
-            trace.write("TabView.UITabBarControllerDelegateClass.tabBarControllerDidSelectViewController(" + tabBarController + ", " + viewController + ");", trace.categories.Debug);
+            trace.write("TabView.delegate.DID_select(" + tabBarController + ", " + viewController + ");", trace.categories.Debug);
         }
+        
         let owner = this._owner.get();
         if (owner) {
             owner._onViewControllerShown(viewController);
@@ -74,9 +91,23 @@ class UINavigationControllerDelegateImpl extends NSObject implements UINavigatio
         return delegate;
     }
 
+    navigationControllerWillShowViewControllerAnimated(navigationController: UINavigationController, viewController: UIViewController, animated: boolean): void {
+        if (trace.enabled) {
+            trace.write("TabView.moreNavigationController.WILL_show(" + navigationController + ", " + viewController + ", " + animated + ");", trace.categories.Debug);
+        }
+        
+        let owner = this._owner.get();
+        if (owner) {
+            // If viewController is one of our tab item controllers, then "< More" will be visible shortly.
+            // Otherwise viewController is the UIMoreListController which shows the list of all tabs beyond the 4th tab.
+            let backToMoreWillBeVisible = owner._ios.viewControllers.containsObject(viewController);
+            owner._handleTwoNavigationBars(backToMoreWillBeVisible);
+        }
+    }
+
     navigationControllerDidShowViewControllerAnimated(navigationController: UINavigationController, viewController: UIViewController, animated: boolean): void {
         if (trace.enabled) {
-            trace.write("TabView.UINavigationControllerDelegateClass.navigationControllerDidShowViewControllerAnimated(" + navigationController + ", " + viewController + ", " + animated + ");", trace.categories.Debug);
+            trace.write("TabView.moreNavigationController.DID_show(" + navigationController + ", " + viewController + ", " + animated + ");", trace.categories.Debug);
         }
         // We don't need Edit button in More screen.
         navigationController.navigationBar.topItem.rightBarButtonItem = null;
@@ -127,7 +158,7 @@ function tabsBackgroundColorPropertyChanged(data: dependencyObservable.PropertyC
 (<proxy.PropertyMetadata>common.TabView.tabsBackgroundColorProperty.metadata).onSetNativeValue = tabsBackgroundColorPropertyChanged;
 
 export class TabView extends common.TabView {
-    private _ios: UITabBarControllerImpl;
+    public _ios: UITabBarControllerImpl;
     private _delegate: UITabBarControllerDelegateImpl;
     private _moreNavigationControllerDelegate: UINavigationControllerDelegateImpl;
     private _tabBarHeight: number = 0;
@@ -168,7 +199,7 @@ export class TabView extends common.TabView {
             trace.write("TabView._onViewControllerShown(" + viewController + ");", trace.categories.Debug);
         }
         if (this._ios.viewControllers.containsObject(viewController)) {
-            this.selectedIndex = this._ios.viewControllers.indexOfObject(viewController);;
+            this.selectedIndex = this._ios.viewControllers.indexOfObject(viewController);
         }
         else {
             if (trace.enabled) {
@@ -177,6 +208,34 @@ export class TabView extends common.TabView {
         }
     }
     
+    private _actionBarHidden: boolean;
+    public _handleTwoNavigationBars(backToMoreWillBeVisible: boolean){
+        if (trace.enabled) {
+            trace.write(`TabView._handleTwoNavigationBars(${backToMoreWillBeVisible})`, trace.categories.Debug);
+        }
+ 
+        // The "< Back" and "< More" navigation bars should not be visible simultaneously.
+        let page = <Page>this.page;
+        let actionBarVisible = page.frame._getNavBarVisible(page);
+        let moreNavigationBar = this._ios.moreNavigationController.navigationBar;
+        
+        if (backToMoreWillBeVisible && actionBarVisible){
+            page.frame.ios._disableNavBarAnimation = true;
+            page.actionBarHidden = true;
+            page.frame.ios._disableNavBarAnimation = false;
+            this._actionBarHidden = true;
+            return;
+        }
+        
+        if (!backToMoreWillBeVisible && this._actionBarHidden){
+            page.frame.ios._disableNavBarAnimation = true;
+            page.actionBarHidden = false;
+            page.frame.ios._disableNavBarAnimation = false;
+            this._actionBarHidden = undefined;
+            return;
+        }
+    }
+
     public _removeTabs(oldItems: Array<definition.TabViewItem>) {
         if (trace.enabled) {
             trace.write("TabView._removeTabs(" + oldItems + ");", trace.categories.Debug);