From c02f062457c0e83c953560bcb8a73c7c21c3424a Mon Sep 17 00:00:00 2001
From: Vasil Chimev <Vasil.Chimev@gmail.com>
Date: Thu, 23 Aug 2018 14:05:04 +0300
Subject: [PATCH] feat: apply insets to absolute layout

---
 .../app/absolutelayout/absolutelayout-page.xml     | 14 ++++++++++++++
 e2e/safe-area/app/app.css                          |  4 ++++
 .../layouts/absolute-layout/absolute-layout.ios.ts |  5 +++--
 3 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 e2e/safe-area/app/absolutelayout/absolutelayout-page.xml

diff --git a/e2e/safe-area/app/absolutelayout/absolutelayout-page.xml b/e2e/safe-area/app/absolutelayout/absolutelayout-page.xml
new file mode 100644
index 000000000..bb8659351
--- /dev/null
+++ b/e2e/safe-area/app/absolutelayout/absolutelayout-page.xml
@@ -0,0 +1,14 @@
+<Page xmlns="http://schemas.nativescript.org/tns.xsd">
+
+    <ActionBar>
+        <Label text="AbsoluteLayout Examples"></Label>
+    </ActionBar>
+
+    <AbsoluteLayout class="abs">
+        <Button text="Left: 10, Top: 5" left="10" top="5" backgroundColor="red" />
+        <Button text="Left: 30, Top: 80" left="30" top="80" backgroundColor="green" />
+        <Button text="Left: 150, Top: 25" left="150" top="25" backgroundColor="blue" />
+        <Button text="Left: 70, Top: 150" left="70" top="150" backgroundColor="yellow" />
+    </AbsoluteLayout>
+
+</Page>
diff --git a/e2e/safe-area/app/app.css b/e2e/safe-area/app/app.css
index 43ec11f2c..bbd77bf65 100644
--- a/e2e/safe-area/app/app.css
+++ b/e2e/safe-area/app/app.css
@@ -17,6 +17,10 @@ Page {
     background-color: LightGreen;
 }
 
+.abs {
+    background-color: Lavender;
+}
+
 .dock {
     background-color: HoneyDew;
 }
diff --git a/tns-core-modules/ui/layouts/absolute-layout/absolute-layout.ios.ts b/tns-core-modules/ui/layouts/absolute-layout/absolute-layout.ios.ts
index 98420b2cc..4a07024b1 100644
--- a/tns-core-modules/ui/layouts/absolute-layout/absolute-layout.ios.ts
+++ b/tns-core-modules/ui/layouts/absolute-layout/absolute-layout.ios.ts
@@ -47,13 +47,14 @@ export class AbsoluteLayout extends AbsoluteLayoutBase {
     public onLayout(left: number, top: number, right: number, bottom: number): void {
         super.onLayout(left, top, right, bottom);
 
+        const insets = this.getSafeAreaInsets();
         this.eachLayoutChild((child, last) => {
 
             const childWidth = child.getMeasuredWidth();
             const childHeight = child.getMeasuredHeight();
 
-            const childLeft = this.effectiveBorderLeftWidth + this.effectivePaddingLeft + child.effectiveLeft;
-            const childTop = this.effectiveBorderTopWidth + this.effectivePaddingTop + child.effectiveTop;
+            const childLeft = this.effectiveBorderLeftWidth + this.effectivePaddingLeft + child.effectiveLeft + insets.left;
+            const childTop = this.effectiveBorderTopWidth + this.effectivePaddingTop + child.effectiveTop + insets.top;
             const childRight = childLeft + childWidth + child.effectiveMarginLeft + child.effectiveMarginRight;
             const childBottom = childTop + childHeight + child.effectiveMarginTop + child.effectiveMarginBottom;