From cddc0a682a8e99d8c2f9ebe92515f2e8a5052c64 Mon Sep 17 00:00:00 2001 From: Martin Yankov Date: Fri, 13 Jul 2018 15:41:35 +0300 Subject: [PATCH] fix safe area for ios 10 and less --- tns-core-modules/ui/core/view/view.ios.ts | 21 +++---- .../ui/layouts/layout-base.ios.ts | 57 ++++++++++--------- 2 files changed, 42 insertions(+), 36 deletions(-) diff --git a/tns-core-modules/ui/core/view/view.ios.ts b/tns-core-modules/ui/core/view/view.ios.ts index 0c0c6cae8..4dea4cea9 100644 --- a/tns-core-modules/ui/core/view/view.ios.ts +++ b/tns-core-modules/ui/core/view/view.ios.ts @@ -24,6 +24,8 @@ const PFLAG_FORCE_LAYOUT = 1; const PFLAG_MEASURED_DIMENSION_SET = 1 << 1; const PFLAG_LAYOUT_REQUIRED = 1 << 2; +const majorVersion = iosUtils.MajorVersion; + export class View extends ViewCommon { nativeViewProtected: UIView; viewController: UIViewController; @@ -87,14 +89,13 @@ export class View extends ViewCommon { const { boundsChanged, sizeChanged } = this._setCurrentLayoutBounds(left, top, right, bottom); let actualPosition = {left, top, right, bottom}; if (setFrame) { - // The actual position of a native view can change in case of safe area violation or expansion actualPosition = this.layoutNativeView(left, top, right, bottom) || actualPosition; } if (boundsChanged || (this._privateFlags & PFLAG_LAYOUT_REQUIRED) === PFLAG_LAYOUT_REQUIRED) { let insets = { left: 0, top: 0, right: 0, bottom: 0}; - if (this.nativeViewProtected.safeAreaInsets) { + if (majorVersion > 10) { insets.left = layout.toDevicePixels(this.nativeViewProtected.safeAreaInsets.left); insets.top = layout.toDevicePixels(this.nativeViewProtected.safeAreaInsets.top); insets.right = layout.toDevicePixels(this.nativeViewProtected.safeAreaInsets.right); @@ -740,15 +741,15 @@ export namespace ios { fullscreenSize.height -= (statusBarHeight + navBarHeight); } - // left = safeOrigin.x; - // width = safeAreaSize.width; - // top = safeOrigin.y; - // height = safeAreaSize.height; + left = safeOrigin.x; + width = safeAreaSize.width; + top = safeOrigin.y; + height = safeAreaSize.height; - left = fullscreenOrigin.x; - width = fullscreenSize.width; - top = fullscreenOrigin.y; - height = fullscreenSize.height; + // left = fullscreenOrigin.x; + // width = fullscreenSize.width; + // top = fullscreenOrigin.y; + // height = fullscreenSize.height; // if (hasChildControllers) { // // If not inner most extend to fullscreen diff --git a/tns-core-modules/ui/layouts/layout-base.ios.ts b/tns-core-modules/ui/layouts/layout-base.ios.ts index 6dde49389..822e2a7d3 100644 --- a/tns-core-modules/ui/layouts/layout-base.ios.ts +++ b/tns-core-modules/ui/layouts/layout-base.ios.ts @@ -1,9 +1,12 @@ import { LayoutBaseCommon, clipToBoundsProperty, isPassThroughParentEnabledProperty, View, layout } from "./layout-base-common"; +import { ios as iosUtils } from "../../utils/utils"; export * from "./layout-base-common"; +const majorVersion = iosUtils.MajorVersion; + export class LayoutBase extends LayoutBaseCommon { nativeViewProtected: UIView; @@ -60,33 +63,35 @@ export class LayoutBase extends LayoutBaseCommon { let width = layout.toDevicePixels(frame.size.width); let height = layout.toDevicePixels(frame.size.height); - let newLeft = left; - let newTop = top; - let newWidth = width; - let newHeight = height; + if (majorVersion > 10) { + let newLeft = left; + let newTop = top; + let newWidth = width; + let newHeight = height; - if (onScreenLeft <= layout.toDevicePixels(safeArea.origin.x)) { - newLeft = layout.toDevicePixels(fullscreen.origin.x); - newWidth = width + onScreenLeft; + if (onScreenLeft <= layout.toDevicePixels(safeArea.origin.x)) { + newLeft = layout.toDevicePixels(fullscreen.origin.x); + newWidth = width + onScreenLeft; + } + + if (onScreenTop <= layout.toDevicePixels(safeArea.origin.y)) { + newTop = layout.toDevicePixels(fullscreen.origin.y); + newHeight = height + onScreenTop; + } + + if (width && onScreenLeft + width >= layout.toDevicePixels(safeArea.origin.x) + layout.toDevicePixels(safeArea.size.width)) { + newWidth = newWidth + (layout.toDevicePixels(fullscreen.size.width) - (onScreenLeft + width)); + } + + if (height && onScreenTop + height >= layout.toDevicePixels(safeArea.origin.y) + layout.toDevicePixels(safeArea.size.height)) { + // console.log(">>>>>>>> Bottom Layout: onScreenTop - " + onScreenTop + " height - " + height + " safeAreaOriginY - " + layout.toDevicePixels(safeArea.origin.y) + " safeAreaHeight - " + layout.toDevicePixels(safeArea.size.height)); + newHeight = newHeight + (layout.toDevicePixels(fullscreen.size.height) - (onScreenTop + height)); + } + + const frameNew = CGRectMake(layout.toDeviceIndependentPixels(newLeft), layout.toDeviceIndependentPixels(newTop), layout.toDeviceIndependentPixels(newWidth), layout.toDeviceIndependentPixels(newHeight)); + nativeView.frame = frameNew; } - if (onScreenTop <= layout.toDevicePixels(safeArea.origin.y)) { - newTop = layout.toDevicePixels(fullscreen.origin.y); - newHeight = height + onScreenTop; - } - - if (width && onScreenLeft + width >= layout.toDevicePixels(safeArea.origin.x) + layout.toDevicePixels(safeArea.size.width)) { - newWidth = newWidth + (layout.toDevicePixels(fullscreen.size.width) - (onScreenLeft + width)); - } - - if (height && onScreenTop + height >= layout.toDevicePixels(safeArea.origin.y) + layout.toDevicePixels(safeArea.size.height)) { - // console.log(">>>>>>>> Bottom Layout: onScreenTop - " + onScreenTop + " height - " + height + " safeAreaOriginY - " + layout.toDevicePixels(safeArea.origin.y) + " safeAreaHeight - " + layout.toDevicePixels(safeArea.size.height)); - newHeight = newHeight + (layout.toDevicePixels(fullscreen.size.height) - (onScreenTop + height)); - } - - const frameNew = CGRectMake(layout.toDeviceIndependentPixels(newLeft), layout.toDeviceIndependentPixels(newTop), layout.toDeviceIndependentPixels(newWidth), layout.toDeviceIndependentPixels(newHeight)); - nativeView.frame = frameNew; - // if (leftInset || topInset) { // const frameNew = CGRectMake(layout.toDeviceIndependentPixels(left), layout.toDeviceIndependentPixels(top), layout.toDeviceIndependentPixels(right - left + leftInset), layout.toDeviceIndependentPixels(bottom - top + topInset)); // nativeView.frame = frameNew; @@ -95,11 +100,11 @@ export class LayoutBase extends LayoutBaseCommon { // } // else { const boundsOrigin = nativeView.bounds.origin; - nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, frameNew.size.width, frameNew.size.height); + nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, nativeView.frame.size.width, nativeView.frame.size.height); // } // } - return frameNew; + return nativeView.frame; } [clipToBoundsProperty.getDefault](): boolean {