Using an AbsoluteLayout requires the AbsoluteLayout module.

import * as absoluteLayoutModule from "tns-core-modules/ui/layouts/absolute-layout";

Declaring an AbsoluteLayout

    <Label text="This is Label 1" left="30" top="70" />

Creating and populating a AbsoluteLayout with children

var absoluteLayout = new absoluteLayoutModule.AbsoluteLayout();
absoluteLayout.width = 230;
absoluteLayout.height = 230;
absoluteLayout.style.backgroundColor = new colorModule.Color("LightGray");
var label = new labelModule.Label();
// In absolute layout place of an UI element is determined by 4 parameters : left, top, width and height.
absoluteLayoutModule.AbsoluteLayout.setLeft(label, 10);
absoluteLayoutModule.AbsoluteLayout.setTop(label, 10);
label.width = 100;
label.height = 100;
label.text = "LT";
label.id = "LT";
label.style.backgroundColor = new colorModule.Color("Red");
Is this article helpful? Yes / No
Thank you for your feedback!

Tell us how we can improve this article

NativeScript is licensed under the Apache 2.0 license .
© Progress Software Corporation. All Rights Reserved.