diff --git a/e2e/safe-area/app/home/home-page.xml b/e2e/safe-area/app/home/home-page.xml
index 9d7247209..5ccb8bcc2 100644
--- a/e2e/safe-area/app/home/home-page.xml
+++ b/e2e/safe-area/app/home/home-page.xml
@@ -7,6 +7,7 @@
+
diff --git a/e2e/safe-area/app/listview/action-bar/grid-3x3-nested-listview-page.xml b/e2e/safe-area/app/listview/action-bar/grid-3x3-nested-listview-page.xml
new file mode 100644
index 000000000..5c50028a3
--- /dev/null
+++ b/e2e/safe-area/app/listview/action-bar/grid-3x3-nested-listview-page.xml
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/action-bar/listview-nested-grid-3x3-page.xml b/e2e/safe-area/app/listview/action-bar/listview-nested-grid-3x3-page.xml
new file mode 100644
index 000000000..cd84ab719
--- /dev/null
+++ b/e2e/safe-area/app/listview/action-bar/listview-nested-grid-3x3-page.xml
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/action-bar/listview-nested-hstack-page.xml b/e2e/safe-area/app/listview/action-bar/listview-nested-hstack-page.xml
new file mode 100644
index 000000000..cb708c1cf
--- /dev/null
+++ b/e2e/safe-area/app/listview/action-bar/listview-nested-hstack-page.xml
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/action-bar/listview-nested-vstack-page.xml b/e2e/safe-area/app/listview/action-bar/listview-nested-vstack-page.xml
new file mode 100644
index 000000000..eb1ab04c7
--- /dev/null
+++ b/e2e/safe-area/app/listview/action-bar/listview-nested-vstack-page.xml
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/action-bar/listview-page.xml b/e2e/safe-area/app/listview/action-bar/listview-page.xml
new file mode 100644
index 000000000..2a6d88f2e
--- /dev/null
+++ b/e2e/safe-area/app/listview/action-bar/listview-page.xml
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/fragments/grid-3x3-nested-listview-fragment.ts b/e2e/safe-area/app/listview/fragments/grid-3x3-nested-listview-fragment.ts
new file mode 100644
index 000000000..e2e1a66b4
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/grid-3x3-nested-listview-fragment.ts
@@ -0,0 +1,8 @@
+import { Page } from "ui/page";
+
+import { ListViewViewModel } from "./listview-fragment-view-model";
+
+export function onLoaded(args) {
+ const page = args.object;
+ page.bindingContext = new ListViewViewModel();
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/grid-3x3-nested-listview-fragment.xml b/e2e/safe-area/app/listview/fragments/grid-3x3-nested-listview-fragment.xml
new file mode 100644
index 000000000..f50cf66bd
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/grid-3x3-nested-listview-fragment.xml
@@ -0,0 +1,55 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/fragments/listview-fragment-view-model.ts b/e2e/safe-area/app/listview/fragments/listview-fragment-view-model.ts
new file mode 100644
index 000000000..86da6c3e1
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-fragment-view-model.ts
@@ -0,0 +1,18 @@
+import { Observable } from "data/observable";
+
+export class ListViewViewModel extends Observable {
+ items: Array;
+
+ constructor() {
+ super();
+
+ this.items = [];
+
+ for (let i = 0; i < 50; i++) {
+ this.items.push({
+ text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut scelerisque enim mi, id ultrices felis maximus vel.",
+ shortText: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
+ });
+ }
+ }
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-fragment.ts b/e2e/safe-area/app/listview/fragments/listview-fragment.ts
new file mode 100644
index 000000000..e2e1a66b4
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-fragment.ts
@@ -0,0 +1,8 @@
+import { Page } from "ui/page";
+
+import { ListViewViewModel } from "./listview-fragment-view-model";
+
+export function onLoaded(args) {
+ const page = args.object;
+ page.bindingContext = new ListViewViewModel();
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-fragment.xml b/e2e/safe-area/app/listview/fragments/listview-fragment.xml
new file mode 100644
index 000000000..098b9194e
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-fragment.xml
@@ -0,0 +1,5 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-nested-grid-3x3-fragment.ts b/e2e/safe-area/app/listview/fragments/listview-nested-grid-3x3-fragment.ts
new file mode 100644
index 000000000..e2e1a66b4
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-nested-grid-3x3-fragment.ts
@@ -0,0 +1,8 @@
+import { Page } from "ui/page";
+
+import { ListViewViewModel } from "./listview-fragment-view-model";
+
+export function onLoaded(args) {
+ const page = args.object;
+ page.bindingContext = new ListViewViewModel();
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-nested-grid-3x3-fragment.xml b/e2e/safe-area/app/listview/fragments/listview-nested-grid-3x3-fragment.xml
new file mode 100644
index 000000000..2f40fb846
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-nested-grid-3x3-fragment.xml
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-nested-hstack-fragment.ts b/e2e/safe-area/app/listview/fragments/listview-nested-hstack-fragment.ts
new file mode 100644
index 000000000..e2e1a66b4
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-nested-hstack-fragment.ts
@@ -0,0 +1,8 @@
+import { Page } from "ui/page";
+
+import { ListViewViewModel } from "./listview-fragment-view-model";
+
+export function onLoaded(args) {
+ const page = args.object;
+ page.bindingContext = new ListViewViewModel();
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-nested-hstack-fragment.xml b/e2e/safe-area/app/listview/fragments/listview-nested-hstack-fragment.xml
new file mode 100644
index 000000000..b707c03da
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-nested-hstack-fragment.xml
@@ -0,0 +1,9 @@
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-nested-vstack-fragment.ts b/e2e/safe-area/app/listview/fragments/listview-nested-vstack-fragment.ts
new file mode 100644
index 000000000..e2e1a66b4
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-nested-vstack-fragment.ts
@@ -0,0 +1,8 @@
+import { Page } from "ui/page";
+
+import { ListViewViewModel } from "./listview-fragment-view-model";
+
+export function onLoaded(args) {
+ const page = args.object;
+ page.bindingContext = new ListViewViewModel();
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/fragments/listview-nested-vstack-fragment.xml b/e2e/safe-area/app/listview/fragments/listview-nested-vstack-fragment.xml
new file mode 100644
index 000000000..2515787c3
--- /dev/null
+++ b/e2e/safe-area/app/listview/fragments/listview-nested-vstack-fragment.xml
@@ -0,0 +1,9 @@
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/listview-page.ts b/e2e/safe-area/app/listview/listview-page.ts
new file mode 100644
index 000000000..c0f982757
--- /dev/null
+++ b/e2e/safe-area/app/listview/listview-page.ts
@@ -0,0 +1,8 @@
+import { View, EventData } from "tns-core-modules/ui/core/view";
+
+export function onNavigate(args: EventData) {
+ const view = args.object as View;
+ const route = view["route"];
+
+ view.page.frame.navigate(route);
+}
\ No newline at end of file
diff --git a/e2e/safe-area/app/listview/listview-page.xml b/e2e/safe-area/app/listview/listview-page.xml
new file mode 100644
index 000000000..f3c127fca
--- /dev/null
+++ b/e2e/safe-area/app/listview/listview-page.xml
@@ -0,0 +1,28 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/e2e/safe-area/app/listview/no-action-bar/grid-3x3-nested-listview-page.xml b/e2e/safe-area/app/listview/no-action-bar/grid-3x3-nested-listview-page.xml
new file mode 100644
index 000000000..a0ac5a195
--- /dev/null
+++ b/e2e/safe-area/app/listview/no-action-bar/grid-3x3-nested-listview-page.xml
@@ -0,0 +1,7 @@
+
+
+
+
diff --git a/e2e/safe-area/app/listview/no-action-bar/listview-nested-grid-3x3-page.xml b/e2e/safe-area/app/listview/no-action-bar/listview-nested-grid-3x3-page.xml
new file mode 100644
index 000000000..3d5962e56
--- /dev/null
+++ b/e2e/safe-area/app/listview/no-action-bar/listview-nested-grid-3x3-page.xml
@@ -0,0 +1,7 @@
+
+
+
+
diff --git a/e2e/safe-area/app/listview/no-action-bar/listview-nested-hstack-page.xml b/e2e/safe-area/app/listview/no-action-bar/listview-nested-hstack-page.xml
new file mode 100644
index 000000000..b87c794dd
--- /dev/null
+++ b/e2e/safe-area/app/listview/no-action-bar/listview-nested-hstack-page.xml
@@ -0,0 +1,7 @@
+
+
+
+
diff --git a/e2e/safe-area/app/listview/no-action-bar/listview-nested-vstack-page.xml b/e2e/safe-area/app/listview/no-action-bar/listview-nested-vstack-page.xml
new file mode 100644
index 000000000..a76f285e9
--- /dev/null
+++ b/e2e/safe-area/app/listview/no-action-bar/listview-nested-vstack-page.xml
@@ -0,0 +1,7 @@
+
+
+
+
diff --git a/e2e/safe-area/app/listview/no-action-bar/listview-page.xml b/e2e/safe-area/app/listview/no-action-bar/listview-page.xml
new file mode 100644
index 000000000..924d561ad
--- /dev/null
+++ b/e2e/safe-area/app/listview/no-action-bar/listview-page.xml
@@ -0,0 +1,7 @@
+
+
+
+
diff --git a/tns-core-modules/ui/layouts/layout-base.ios.ts b/tns-core-modules/ui/layouts/layout-base.ios.ts
index a2f7d4ef8..3bb02a952 100644
--- a/tns-core-modules/ui/layouts/layout-base.ios.ts
+++ b/tns-core-modules/ui/layouts/layout-base.ios.ts
@@ -7,7 +7,7 @@ const majorVersion = iosUtils.MajorVersion;
export class LayoutBase extends LayoutBaseCommon {
nativeViewProtected: UIView;
-
+
public addChild(child: View): void {
super.addChild(child);
this.requestLayout();
@@ -33,26 +33,28 @@ export class LayoutBase extends LayoutBaseCommon {
public _setNativeViewFrame(nativeView: UIView, frame: CGRect) {
// if (!CGRectEqualToRect(nativeView.frame, frame)) {
- // if (traceEnabled()) {
- // traceWrite(this + ", Native setFrame: = " + NSStringFromCGRect(frame), traceCategories.Layout);
- // }
- // this._cachedFrame = frame;
- // if (this._hasTransfrom) {
- // // Always set identity transform before setting frame;
- // const transform = nativeView.transform;
- // nativeView.transform = CGAffineTransformIdentity;
- // nativeView.frame = frame;
- // nativeView.transform = transform;
- // }
- // else {
- // nativeView.frame = frame;
- // }
+ // if (traceEnabled()) {
+ // traceWrite(this + ", Native setFrame: = " + NSStringFromCGRect(frame), traceCategories.Layout);
+ // }
+ // this._cachedFrame = frame;
+ // if (this._hasTransfrom) {
+ // // Always set identity transform before setting frame;
+ // const transform = nativeView.transform;
+ // nativeView.transform = CGAffineTransformIdentity;
+ // nativeView.frame = frame;
+ // nativeView.transform = transform;
+ // }
+ // else {
+ // nativeView.frame = frame;
+ // }
- nativeView.frame = frame;
+ nativeView.frame = frame;
+ const locationOnScreen = this.getLocationInWindow();
+
+ if (locationOnScreen) {
const safeArea = this.getSafeArea();
const fullscreen = this.getFullscreenArea();
- const locationOnScreen = this.getLocationInWindow();
const onScreenLeft = layout.toDevicePixels(layout.round(locationOnScreen.x));
const onScreenTop = layout.toDevicePixels(layout.round(locationOnScreen.y));
@@ -88,6 +90,7 @@ export class LayoutBase extends LayoutBaseCommon {
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));
@@ -96,14 +99,14 @@ export class LayoutBase extends LayoutBaseCommon {
// nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, frameNew.size.width, frameNew.size.height);
// }
// else {
- const boundsOrigin = nativeView.bounds.origin;
- nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, nativeView.frame.size.width, nativeView.frame.size.height);
+ const boundsOrigin = nativeView.bounds.origin;
+ nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, nativeView.frame.size.width, nativeView.frame.size.height);
// }
- // }
-
- return nativeView.frame;
+ // }
+
+ return nativeView.frame;
}
-
+
[clipToBoundsProperty.getDefault](): boolean {
return false;
}
diff --git a/tns-core-modules/ui/list-view/list-view.ios.ts b/tns-core-modules/ui/list-view/list-view.ios.ts
index ed2a89d00..afb6af08a 100644
--- a/tns-core-modules/ui/list-view/list-view.ios.ts
+++ b/tns-core-modules/ui/list-view/list-view.ios.ts
@@ -7,6 +7,7 @@ import { StackLayout } from "../layouts/stack-layout";
import { ProxyViewContainer } from "../proxy-view-container";
import { profile } from "../../profiling";
import * as trace from "../../trace";
+import { ios as iosUtils } from "../../utils/utils";
export * from "./list-view-common";
@@ -22,6 +23,7 @@ interface ViewItemIndex {
}
type ItemView = View & ViewItemIndex;
+const majorVersion = iosUtils.MajorVersion;
class ListViewCell extends UITableViewCell {
public static initWithEmptyBackground(): ListViewCell {
@@ -378,6 +380,81 @@ export class ListView extends ListViewBase {
});
}
+ public _setNativeViewFrame(nativeView: UIView, frame: CGRect) {
+ // if (!CGRectEqualToRect(nativeView.frame, frame)) {
+ // if (traceEnabled()) {
+ // traceWrite(this + ", Native setFrame: = " + NSStringFromCGRect(frame), traceCategories.Layout);
+ // }
+ // this._cachedFrame = frame;
+ // if (this._hasTransfrom) {
+ // // Always set identity transform before setting frame;
+ // const transform = nativeView.transform;
+ // nativeView.transform = CGAffineTransformIdentity;
+ // nativeView.frame = frame;
+ // nativeView.transform = transform;
+ // }
+ // else {
+ // nativeView.frame = frame;
+ // }
+
+ nativeView.frame = frame;
+
+ const safeArea = this.getSafeArea();
+ const fullscreen = this.getFullscreenArea();
+ const locationOnScreen = this.getLocationInWindow();
+ const onScreenLeft = layout.toDevicePixels(layout.round(locationOnScreen.x));
+ const onScreenTop = layout.toDevicePixels(layout.round(locationOnScreen.y));
+
+ let left = layout.toDevicePixels(frame.origin.x);
+ let top = layout.toDevicePixels(frame.origin.y);
+ let width = layout.toDevicePixels(frame.size.width);
+ let height = layout.toDevicePixels(frame.size.height);
+
+ if (majorVersion > 10) {
+ // this._ios.insetsContentViewsToSafeArea = false;
+
+ let newLeft = left;
+ let newTop = top;
+ let newWidth = width;
+ let newHeight = height;
+
+ if (left !== 0 && onScreenLeft <= layout.toDevicePixels(safeArea.origin.x)) {
+ newLeft = layout.toDevicePixels(fullscreen.origin.x);
+ newWidth = width + onScreenLeft;
+ }
+
+ if (top !== 0 && onScreenTop <= layout.toDevicePixels(safeArea.origin.y)) {
+ newTop = layout.toDevicePixels(fullscreen.origin.y);
+ newHeight = height + onScreenTop;
+ }
+
+ if (width && width < layout.toDevicePixels(fullscreen.size.width) && onScreenLeft + width >= layout.toDevicePixels(safeArea.origin.x) + layout.toDevicePixels(safeArea.size.width)) {
+ newWidth = newWidth + (layout.toDevicePixels(fullscreen.size.width) - (onScreenLeft + width));
+ }
+
+ if (height && height < layout.toDevicePixels(fullscreen.size.height) && onScreenTop + height >= layout.toDevicePixels(safeArea.origin.y) + 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;
+ // const boundsOrigin = nativeView.bounds.origin;
+ // nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, frameNew.size.width, frameNew.size.height);
+ // }
+ // else {
+ const boundsOrigin = nativeView.bounds.origin;
+ nativeView.bounds = CGRectMake(boundsOrigin.x, boundsOrigin.y, nativeView.frame.size.width, nativeView.frame.size.height);
+ // }
+ // }
+
+ return nativeView.frame;
+ }
+
private _layoutCell(cellView: View, indexPath: NSIndexPath): number {
if (cellView) {
const rowHeight = this._effectiveRowHeight;