diff --git a/e2e/ui-tests-app/app/tabs/main-page.ts b/e2e/ui-tests-app/app/tabs/main-page.ts
index 65d381991..17acc66e8 100644
--- a/e2e/ui-tests-app/app/tabs/main-page.ts
+++ b/e2e/ui-tests-app/app/tabs/main-page.ts
@@ -27,6 +27,8 @@ export function loadExamples() {
examples.set("tabs-position", "tabs/tabs-position-page");
examples.set("tabs-binding", "tabs/tabs-binding-page");
examples.set("font-icons", "tabs/font-icons-page");
+ examples.set("nested-layout", "tabs/nested-layout-page");
+ examples.set("nested-bottom-navigation", "tabs/nested-bottom-navigation-page");
return examples;
}
diff --git a/e2e/ui-tests-app/app/tabs/nested-bottom-navigation-page.xml b/e2e/ui-tests-app/app/tabs/nested-bottom-navigation-page.xml
new file mode 100644
index 000000000..c2e750418
--- /dev/null
+++ b/e2e/ui-tests-app/app/tabs/nested-bottom-navigation-page.xml
@@ -0,0 +1,39 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/e2e/ui-tests-app/app/tabs/nested-layout-page.xml b/e2e/ui-tests-app/app/tabs/nested-layout-page.xml
new file mode 100644
index 000000000..922365fe3
--- /dev/null
+++ b/e2e/ui-tests-app/app/tabs/nested-layout-page.xml
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/e2e/ui-tests-app/app/tabs/tabs-page.xml b/e2e/ui-tests-app/app/tabs/tabs-page.xml
index e16c9aa92..865a806fa 100644
--- a/e2e/ui-tests-app/app/tabs/tabs-page.xml
+++ b/e2e/ui-tests-app/app/tabs/tabs-page.xml
@@ -3,87 +3,34 @@
-
-
-
-
-
-
+
+
-
-
-
-
-
+
-
+
-
+
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/tns-core-modules/ui/tabs/tabs.ios.ts b/tns-core-modules/ui/tabs/tabs.ios.ts
index c3202c310..f85baf621 100644
--- a/tns-core-modules/ui/tabs/tabs.ios.ts
+++ b/tns-core-modules/ui/tabs/tabs.ios.ts
@@ -111,14 +111,23 @@ class UIPageViewControllerImpl extends UIPageViewController {
public viewDidLayoutSubviews(): void {
super.viewDidLayoutSubviews();
-
const owner = this._owner.get();
+ if (!owner) {
+ return;
+ }
+
const tabsPosition = owner.tabsPosition;
+ const parent = owner.parent;
let tabBarTop = this.view.safeAreaInsets.top;
let tabBarHeight = this.tabBar.frame.size.height;
let scrollViewTop = this.tabBar.frame.size.height;
- let scrollViewHeight = this.view.bounds.size.height - this.tabBar.frame.size.height + this.view.safeAreaInsets.bottom;
+ let scrollViewHeight = this.view.bounds.size.height - this.tabBar.frame.size.height;
+
+ if (parent) {
+ // TODO: Figure out a better way to handle ViewController nesting/Safe Area nesting
+ tabBarTop = Math.max(this.view.safeAreaInsets.top, owner.parent.nativeView.safeAreaInsets.top);
+ }
if (tabsPosition === "bottom") {
tabBarTop = this.view.frame.size.height - this.tabBar.frame.size.height - this.view.safeAreaInsets.bottom;
@@ -126,45 +135,7 @@ class UIPageViewControllerImpl extends UIPageViewController {
scrollViewHeight = this.view.frame.size.height - this.view.safeAreaInsets.bottom;
}
- this.tabBar.frame = CGRectMake(this.view.safeAreaInsets.left, tabBarTop, this.tabBar.frame.size.width, tabBarHeight); //this.view.safeAreaLayoutGuide.layoutFrame;
- // this.additionalSafeAreaInsets = new UIEdgeInsets({ top: this.tabBar.frame.size.height, left: 0, bottom: 0, right: 0 });
- // const tabBar = MDCTabBar.alloc().initWithFrame(this.view.safeAreaLayoutGuide.layoutFrame);
-
- // tabBar.items = >NSArray.alloc().initWithArray([
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // ]);
-
- // tabBar.itemAppearance = MDCTabBarItemAppearance.Titles;
- // tabBar.tintColor = UIColor.greenColor;
- // tabBar.barTintColor = UIColor.yellowColor;
- // tabBar.setTitleColorForState(UIColor.blackColor, MDCTabBarItemState.Normal);
- // tabBar.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleBottomMargin;
- // tabBar.sizeToFit();
- // this.view.addSubview(tabBar);
-
- // this.view.bringSubviewToFront(tabBar);
-
- // const tabBar = MDCTabBar.alloc().initWithFrame(this.view.bounds);
- // tabBar.items = >NSArray.alloc().initWithArray([
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0),
- // UITabBarItem.alloc().initWithTitleImageTag("Test", null, 0)
- // ]);
-
- // tabBar.itemAppearance = MDCTabBarItemAppearance.Titles;
- // tabBar.autoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleBottomMargin;
- // tabBar.sizeToFit();
- // this.view.addSubview(tabBar);
+ this.tabBar.frame = CGRectMake(this.view.safeAreaInsets.left, tabBarTop, this.tabBar.frame.size.width, tabBarHeight);
const subViews: NSArray = this.view.subviews;
let scrollView: UIScrollView = null;
@@ -192,47 +163,6 @@ class UIPageViewControllerImpl extends UIPageViewController {
scrollView.frame = CGRectMake(this.view.safeAreaInsets.left, scrollViewTop, this.view.bounds.size.width, scrollViewHeight); //this.view.bounds;
}
-
- // if (mdcBar) {
- // mdcBar.frame = this.view.bounds;
- // }
-
- // const owner = this.owner.get();
- // if (owner) {
- // if (majorVersion >= 11) {
- // // Handle nested UILayoutViewController safe area application.
- // // Currently, UILayoutViewController can be nested only in a TabView.
- // // The TabView itself is handled by the OS, so we check the TabView's parent (usually a Page, but can be a Layout).
- // const tabViewItem = owner.parent;
- // const tabView = tabViewItem && tabViewItem.parent;
- // let parent = tabView && tabView.parent;
-
- // // Handle Angular scenario where TabView is in a ProxyViewContainer
- // // It is possible to wrap components in ProxyViewContainers indefinitely
- // // Not using instanceof ProxyViewContainer to avoid circular dependency
- // // TODO: Try moving UILayoutViewController out of view module
- // while (parent && !parent.nativeViewProtected) {
- // parent = parent.parent;
- // }
-
- // if (parent) {
- // const parentPageInsetsTop = parent.nativeViewProtected.safeAreaInsets.top;
- // const currentInsetsTop = this.view.safeAreaInsets.top;
- // const additionalInsetsTop = Math.max(parentPageInsetsTop - currentInsetsTop, 0);
-
- // const parentPageInsetsBottom = parent.nativeViewProtected.safeAreaInsets.bottom;
- // const currentInsetsBottom = this.view.safeAreaInsets.bottom;
- // const additionalInsetsBottom = Math.max(parentPageInsetsBottom - currentInsetsBottom, 0);
-
- // if (additionalInsetsTop > 0 || additionalInsetsBottom > 0) {
- // const additionalInsets = new UIEdgeInsets({ top: additionalInsetsTop, left: 0, bottom: additionalInsetsBottom, right: 0 });
- // this.additionalSafeAreaInsets = additionalInsets;
- // }
- // }
- // }
-
- // layoutView(this, owner);
- // }
}
}