diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 165dce381..ab4c7e502 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -198,6 +198,12 @@
+
+
+
+
+
+
@@ -628,6 +634,11 @@
Designer
+
+
+
+
+
diff --git a/apps/ui-tests-app/layouts/absolute.ts b/apps/ui-tests-app/layouts/absolute.ts
new file mode 100644
index 000000000..6c867680a
--- /dev/null
+++ b/apps/ui-tests-app/layouts/absolute.ts
@@ -0,0 +1,22 @@
+import pageModule = require("ui/page");
+import absoluteLayout = require("ui/layouts/absolute-layout");
+import model = require("./myview");
+
+var count = 0;
+
+export function onLoaded(args: { eventName: string, object: any }) {
+ var page = args.object;
+ page.bindingContext = new model.ViewModel();
+}
+
+export function onSetLeftSetTop(args: { eventName: string, object: any }) {
+ var layout = args.object.parent;
+ var child = layout.getViewById("setLeftSetTop");
+ if(++count % 2 === 1) {
+ absoluteLayout.AbsoluteLayout.setLeft(child, 175);
+ absoluteLayout.AbsoluteLayout.setTop(child, 375);
+ } else {
+ absoluteLayout.AbsoluteLayout.setLeft(child, 0);
+ absoluteLayout.AbsoluteLayout.setTop(child, 400);
+ }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/absolute.xml b/apps/ui-tests-app/layouts/absolute.xml
new file mode 100644
index 000000000..01f911b37
--- /dev/null
+++ b/apps/ui-tests-app/layouts/absolute.xml
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/dock.ts b/apps/ui-tests-app/layouts/dock.ts
new file mode 100644
index 000000000..549e7fa63
--- /dev/null
+++ b/apps/ui-tests-app/layouts/dock.ts
@@ -0,0 +1,16 @@
+import pageModule = require("ui/page");
+import model = require("./myview");
+
+export function onLoaded(args: { eventName: string, object: any }) {
+ var page = args.object;
+ page.bindingContext = new model.ViewModel();
+}
+
+export function onStretchLastChild(args: { eventName: string, object: any }) {
+ var layout = args.object.parent;
+ if(layout.stretchLastChild === true) {
+ layout.stretchLastChild = false;
+ } else {
+ layout.stretchLastChild = true;
+ }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/dock.xml b/apps/ui-tests-app/layouts/dock.xml
new file mode 100644
index 000000000..750eb57d2
--- /dev/null
+++ b/apps/ui-tests-app/layouts/dock.xml
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/grid.ts b/apps/ui-tests-app/layouts/grid.ts
new file mode 100644
index 000000000..2086589ea
--- /dev/null
+++ b/apps/ui-tests-app/layouts/grid.ts
@@ -0,0 +1,43 @@
+import buttonModule = require("ui/button");
+import pageModule = require("ui/page");
+import gridLayoutModule = require("ui/layouts/grid-layout");
+import model = require("./myview");
+
+export function onLoaded(args: { eventName: string, object: any }) {
+ var page = args.object;
+ page.bindingContext = new model.ViewModel();
+}
+
+export function onAddRowColumn(args: { eventName: string, object: any }) {
+ var layout = args.object.parent.parent;
+ var row = new gridLayoutModule.ItemSpec(1, gridLayoutModule.GridUnitType.auto);
+ var column = new gridLayoutModule.ItemSpec(1, gridLayoutModule.GridUnitType.auto);
+ layout.addRow(row);
+ layout.addColumn(column);
+
+ var btn0 = new buttonModule.Button();
+ var btn1 = new buttonModule.Button();
+ btn0.id = "b0";
+ btn1.id = "b1";
+ btn0.text = "b0";
+ btn1.text = "b1";
+ layout.addChild(btn0);
+ layout.addChild(btn1);
+ gridLayoutModule.GridLayout.setRow(btn0, 0);
+ gridLayoutModule.GridLayout.setColumn(btn0, 4);
+ gridLayoutModule.GridLayout.setRow(btn1, 4);
+ gridLayoutModule.GridLayout.setColumn(btn1, 0);
+ gridLayoutModule.GridLayout.setColumnSpan(btn1, 2);
+ gridLayoutModule.GridLayout.setRowSpan(btn0, 3);
+}
+
+export function onRemoveRowColumn(args: { eventName: string, object: any }) {
+ var layout = args.object.parent.parent;
+ var itemSpecs, count;
+ itemSpecs = layout.getRows();
+ count = itemSpecs.length;
+ layout.removeRow(itemSpecs[count - 1]);
+ itemSpecs = layout.getColumns();
+ count = itemSpecs.length;
+ layout.removeColumn(itemSpecs[count - 1]);
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/grid.xml b/apps/ui-tests-app/layouts/grid.xml
new file mode 100644
index 000000000..6a80f433f
--- /dev/null
+++ b/apps/ui-tests-app/layouts/grid.xml
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/myview.ts b/apps/ui-tests-app/layouts/myview.ts
new file mode 100644
index 000000000..c0005aa35
--- /dev/null
+++ b/apps/ui-tests-app/layouts/myview.ts
@@ -0,0 +1,167 @@
+import observable = require("data/observable");
+import enums = require("ui/enums");
+import view = require("ui/core/view");
+import layouts = require("ui/layouts/layout");
+
+export class ViewModel extends observable.Observable {
+
+ // View properties
+ public onWidthHeight(args: { eventName: string, object: any }): void {
+ var view: view.View = args.object;
+ if (view.width !== 30) {
+ view.width = 30;
+ view.height = 50;
+ } else {
+ view.width = Number.NaN;
+ view.height = Number.NaN;
+ }
+ }
+
+ public onMinWidthMinHeight(args: { eventName: string, object: any }): void {
+ var view: view.View = args.object;
+ if (view.minWidth !== 66) {
+ view.minWidth = 66;
+ view.minHeight = 55;
+ } else {
+ view.minWidth = 0;
+ view.minHeight = 0;
+ }
+ }
+
+ public onMargins(args: { eventName: string, object: any }): void {
+ var view: view.View = args.object;
+ if (view.marginLeft !== 5) {
+ view.marginLeft = 5;
+ view.marginTop = 5;
+ view.marginRight = 5;
+ view.marginBottom = 5;
+ } else {
+ view.marginLeft = 0;
+ view.marginTop = 0;
+ view.marginRight = 0;
+ view.marginBottom = 0;
+ }
+ }
+
+ public onAlignments(args: { eventName: string, object: any }): void {
+ var view: view.View = args.object;
+ if (view.horizontalAlignment === enums.HorizontalAlignment.stretch) {
+ view.horizontalAlignment = enums.HorizontalAlignment.left;
+ view.verticalAlignment = enums.VerticalAlignment.top;
+ } else if (view.horizontalAlignment === enums.HorizontalAlignment.left) {
+ view.horizontalAlignment = enums.HorizontalAlignment.center;
+ view.verticalAlignment = enums.VerticalAlignment.center;
+ } else if (view.horizontalAlignment === enums.HorizontalAlignment.center) {
+ view.horizontalAlignment = enums.HorizontalAlignment.right;
+ view.verticalAlignment = enums.VerticalAlignment.bottom;
+ } else {
+ view.horizontalAlignment = enums.HorizontalAlignment.stretch;
+ view.verticalAlignment = enums.VerticalAlignment.stretch;
+ }
+ }
+
+ public onCollapse(args: { eventName: string, object: any }): void {
+ var view: view.View = args.object;
+ view.visibility = enums.Visibility.collapse;
+ }
+
+ public onVisibile(args: { eventName: string, object: any }): void {
+ var view: view.View = args.object;
+ var layout = view.parent;
+
+ var child = layout.getViewById("collapse");
+ child.visibility = enums.Visibility.visible;
+ }
+
+ // Layout properties
+ public onPaddings(args: { eventName: string, object: any }): void {
+ var layout = args.object.parent;
+ if (layout.paddingLeft !== 5) {
+ layout.paddingLeft = 5;
+ layout.paddingTop = 5;
+ layout.paddingRight = 5;
+ layout.paddingBottom = 5;
+ } else {
+ layout.paddingLeft = 0;
+ layout.paddingTop = 0;
+ layout.paddingRight = 0;
+ layout.paddingBottom = 0;
+ }
+ }
+
+ public onAllProperties(args: { eventName: string, object: any }): void {
+ var child;
+ var layout = args.object.parent;
+
+ // WidthHeight
+ child = layout.getViewById("widthHeight");
+ if (child.width !== 30) {
+ child.width = 30;
+ child.height = 50;
+ } else {
+ child.width = Number.NaN;
+ child.height = Number.NaN;
+ }
+
+ // MinWidthMinHeight
+ child = layout.getViewById("minWidthMinHeight");
+ if (child.minWidth !== 66) {
+ child.minWidth = 66;
+ child.minHeight = 55;
+ } else {
+ child.minWidth = 0;
+ child.minHeight = 0;
+ }
+
+ // Margins
+ child = layout.getViewById("margins");
+ if (child.marginLeft !== 5) {
+ child.marginLeft = 5;
+ child.marginTop = 5;
+ child.marginRight = 5;
+ child.marginBottom = 5;
+ } else {
+ child.marginLeft = 0;
+ child.marginTop = 0;
+ child.marginRight = 0;
+ child.marginBottom = 0;
+ }
+
+ // Alignments
+ child = layout.getViewById("alignments");
+ if (child.horizontalAlignment === enums.HorizontalAlignment.stretch) {
+ child.horizontalAlignment = enums.HorizontalAlignment.left;
+ child.verticalAlignment = enums.VerticalAlignment.top;
+ } else if (child.horizontalAlignment === enums.HorizontalAlignment.left) {
+ child.horizontalAlignment = enums.HorizontalAlignment.center;
+ child.verticalAlignment = enums.VerticalAlignment.center;
+ } else if (child.horizontalAlignment === enums.HorizontalAlignment.center) {
+ child.horizontalAlignment = enums.HorizontalAlignment.right;
+ child.verticalAlignment = enums.VerticalAlignment.bottom;
+ } else {
+ child.horizontalAlignment = enums.HorizontalAlignment.stretch;
+ child.verticalAlignment = enums.VerticalAlignment.stretch;
+ }
+
+ // Collapse
+ child = layout.getViewById("collapse");
+ if (child.visibility === enums.Visibility.visible) {
+ child.visibility = enums.Visibility.collapse;
+ } else {
+ child.visibility = enums.Visibility.visible;
+ }
+
+ // Paddings
+ if (layout.paddingLeft !== 5) {
+ layout.paddingLeft = 5;
+ layout.paddingTop = 5;
+ layout.paddingRight = 5;
+ layout.paddingBottom = 5;
+ } else {
+ layout.paddingLeft = 0;
+ layout.paddingTop = 0;
+ layout.paddingRight = 0;
+ layout.paddingBottom = 0;
+ }
+ }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/stack.ts b/apps/ui-tests-app/layouts/stack.ts
new file mode 100644
index 000000000..f6c428d12
--- /dev/null
+++ b/apps/ui-tests-app/layouts/stack.ts
@@ -0,0 +1,17 @@
+import enums = require("ui/enums");
+import pageModule = require("ui/page");
+import model = require("./myview");
+
+export function onLoaded(args: { eventName: string, object: any }) {
+ var page = args.object;
+ page.bindingContext = new model.ViewModel();
+}
+
+export function onOrientation(args: { eventName: string, object: any }) {
+ var layout = args.object.parent;
+ if(layout.orientation === enums.Orientation.vertical) {
+ layout.orientation = enums.Orientation.horizontal;
+ } else {
+ layout.orientation = enums.Orientation.vertical;
+ }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/stack.xml b/apps/ui-tests-app/layouts/stack.xml
new file mode 100644
index 000000000..27fdfce55
--- /dev/null
+++ b/apps/ui-tests-app/layouts/stack.xml
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/wrap.ts b/apps/ui-tests-app/layouts/wrap.ts
new file mode 100644
index 000000000..a6ad5a53a
--- /dev/null
+++ b/apps/ui-tests-app/layouts/wrap.ts
@@ -0,0 +1,28 @@
+import enums = require("ui/enums");
+import pageModule = require("ui/page");
+import model = require("./myview");
+
+export function onLoaded(args: { eventName: string, object: any }) {
+ var page = args.object;
+ page.bindingContext = new model.ViewModel();
+}
+
+export function onOrientation(args: { eventName: string, object: any }) {
+ var layout = args.object.parent;
+ if(layout.orientation === enums.Orientation.vertical) {
+ layout.orientation = enums.Orientation.horizontal;
+ } else {
+ layout.orientation = enums.Orientation.vertical;
+ }
+}
+
+export function onItemWidthItemHeight(args: { eventName: string, object: any }) {
+ var layout = args.object.parent;
+ if(layout.itemWidth !== 40) {
+ layout.itemWidth = 40;
+ layout.itemHeight = 60;
+ } else {
+ layout.itemWidth = Number.NaN;
+ layout.itemHeight = Number.NaN;
+ }
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/layouts/wrap.xml b/apps/ui-tests-app/layouts/wrap.xml
new file mode 100644
index 000000000..407516142
--- /dev/null
+++ b/apps/ui-tests-app/layouts/wrap.xml
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file