diff --git a/apps/ui/src/tabs/frame-in-tabs-inner-page-1.xml b/apps/ui/src/tabs/frame-in-tabs-inner-page-1.xml index f0c7c0c06..6e84cd59d 100644 --- a/apps/ui/src/tabs/frame-in-tabs-inner-page-1.xml +++ b/apps/ui/src/tabs/frame-in-tabs-inner-page-1.xml @@ -1,3 +1,12 @@ - \ No newline at end of file + + + diff --git a/apps/ui/src/tabs/frame-in-tabs-overflow.xml b/apps/ui/src/tabs/frame-in-tabs-overflow.xml new file mode 100644 index 000000000..e0df8bd11 --- /dev/null +++ b/apps/ui/src/tabs/frame-in-tabs-overflow.xml @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/apps/ui/src/tabs/main-page.ts b/apps/ui/src/tabs/main-page.ts index df5477457..7e9ffb6d1 100644 --- a/apps/ui/src/tabs/main-page.ts +++ b/apps/ui/src/tabs/main-page.ts @@ -31,6 +31,7 @@ export function loadExamples() { examples.set('nested-bottom-navigation', 'tabs/nested-bottom-navigation-page'); examples.set('custom-tabstrip', 'tabs/custom-tabstrip-page'); examples.set('frame-in-tabs', 'tabs/frame-in-tabs'); + examples.set('frame-in-tabs-overflow', 'tabs/frame-in-tabs-overflow'); examples.set('item-color', 'tabs/item-color-page'); examples.set('dynamic-color-change', 'tabs/dynamic-color-change-page'); diff --git a/packages/core/ui/tabs/index.ios.ts b/packages/core/ui/tabs/index.ios.ts index 32a4a6e25..1a186804c 100644 --- a/packages/core/ui/tabs/index.ios.ts +++ b/packages/core/ui/tabs/index.ios.ts @@ -172,20 +172,22 @@ class UIPageViewControllerImpl extends UIPageViewController { safeAreaInsetsTop = this.topLayoutGuide.length; } + let conditionalSafeAreaBottom = owner.iosOverflowSafeArea ? safeAreaInsetsBottom : 0; let scrollViewTop = 0; - let scrollViewHeight = this.view.bounds.size.height + safeAreaInsetsBottom; + let scrollViewHeight = this.view.bounds.size.height + conditionalSafeAreaBottom; if (owner.tabStrip) { - scrollViewTop = this.tabBar.frame.size.height; - scrollViewHeight = this.view.bounds.size.height - this.tabBar.frame.size.height + safeAreaInsetsBottom; - let tabBarTop = safeAreaInsetsTop; const tabBarHeight = this.tabBar.frame.size.height; + let tabBarTop = safeAreaInsetsTop; + + scrollViewTop = tabBarHeight; + scrollViewHeight = this.view.bounds.size.height - tabBarHeight + conditionalSafeAreaBottom; const tabsPosition = owner.tabsPosition; if (tabsPosition === 'bottom') { - tabBarTop = this.view.frame.size.height - this.tabBar.frame.size.height - safeAreaInsetsBottom; + tabBarTop = this.view.frame.size.height - tabBarHeight - safeAreaInsetsBottom; scrollViewTop = this.view.frame.origin.y; - scrollViewHeight = this.view.frame.size.height - safeAreaInsetsBottom; + scrollViewHeight = this.view.frame.size.height - tabBarHeight; } let parent = owner.parent;