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 30cbb09f3..1a186804c 100644
--- a/packages/core/ui/tabs/index.ios.ts
+++ b/packages/core/ui/tabs/index.ios.ts
@@ -172,15 +172,16 @@ class UIPageViewControllerImpl extends UIPageViewController {
safeAreaInsetsTop = this.topLayoutGuide.length;
}
+ let conditionalSafeAreaBottom = owner.iosOverflowSafeArea ? safeAreaInsetsBottom : 0;
let scrollViewTop = 0;
- let scrollViewHeight = this.view.bounds.size.height;
+ let scrollViewHeight = this.view.bounds.size.height + conditionalSafeAreaBottom;
if (owner.tabStrip) {
const tabBarHeight = this.tabBar.frame.size.height;
let tabBarTop = safeAreaInsetsTop;
scrollViewTop = tabBarHeight;
- scrollViewHeight = this.view.bounds.size.height - tabBarHeight;
+ scrollViewHeight = this.view.bounds.size.height - tabBarHeight + conditionalSafeAreaBottom;
const tabsPosition = owner.tabsPosition;
if (tabsPosition === 'bottom') {