From b0aee9d7a90ea7776ee65f72904876ceeb4569bb Mon Sep 17 00:00:00 2001 From: Rossen Hristov Date: Mon, 27 Jun 2016 15:10:02 +0300 Subject: [PATCH] Fix: The navigation bar duplicates when going to TabView's "More" tab Resolves #2121 --- tns-core-modules/ui/frame/frame.d.ts | 4 ++ tns-core-modules/ui/frame/frame.ios.ts | 6 +- tns-core-modules/ui/tab-view/tab-view.ios.ts | 67 ++++++++++++++++++-- 3 files changed, 72 insertions(+), 5 deletions(-) diff --git a/tns-core-modules/ui/frame/frame.d.ts b/tns-core-modules/ui/frame/frame.d.ts index 0c5bf36f5..430e06452 100644 --- a/tns-core-modules/ui/frame/frame.d.ts +++ b/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 diff --git a/tns-core-modules/ui/frame/frame.ios.ts b/tns-core-modules/ui/frame/frame.ios.ts index ae7a1eb5e..ed1118622 100644 --- a/tns-core-modules/ui/frame/frame.ios.ts +++ b/tns-core-modules/ui/frame/frame.ios.ts @@ -661,6 +661,10 @@ class iOSFrame implements definition.iOSFrame { private _showNavigationBar: boolean; 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; @@ -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; diff --git a/tns-core-modules/ui/tab-view/tab-view.ios.ts b/tns-core-modules/ui/tab-view/tab-view.ios.ts index d27ce25a1..f369a6058 100644 --- a/tns-core-modules/ui/tab-view/tab-view.ios.ts +++ b/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 (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) { @@ -176,6 +207,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 = 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) { if (trace.enabled) {