From f634f29df02d823d6d643fdedaa7c9fc522d4a32 Mon Sep 17 00:00:00 2001 From: vakrilov Date: Tue, 10 Jan 2017 14:08:20 +0200 Subject: [PATCH] Frame test --- tests/app/testRunner.ts | 2 +- tests/app/ui/frame/frame-tests.ios.ts | 49 ++++++++++++++++-------- tns-core-modules/ui/core/view-base.ts | 11 +++--- tns-core-modules/ui/core/view-common.ts | 2 +- tns-core-modules/ui/page/page.android.ts | 2 +- tns-core-modules/ui/page/page.ios.ts | 19 ++++++++- 6 files changed, 59 insertions(+), 26 deletions(-) diff --git a/tests/app/testRunner.ts b/tests/app/testRunner.ts index cb3ef302d..6e05b6763 100644 --- a/tests/app/testRunner.ts +++ b/tests/app/testRunner.ts @@ -64,7 +64,7 @@ allTests["GRIDLAYOUT"] = require("./ui/layouts/grid-layout-tests"); allTests["STACKLAYOUT"] = require("./ui/layouts/stack-layout-tests"); allTests["FLEXBOXLAYOUT"] = require("./ui/layouts/flexbox-layout-tests"); allTests["STYLE-PROPERTIES"] = require("./ui/styling/style-properties-tests"); -// allTests["FRAME"] = require("./ui/frame/frame-tests"); +allTests["FRAME"] = require("./ui/frame/frame-tests"); // allTests["VIEW"] = require("./ui/view/view-tests"); // allTests["STYLE"] = require("./ui/styling/style-tests"); // allTests["VISUAL-STATE"] = require("./ui/styling/visual-state-tests"); diff --git a/tests/app/ui/frame/frame-tests.ios.ts b/tests/app/ui/frame/frame-tests.ios.ts index 13760cef9..81fa1a826 100644 --- a/tests/app/ui/frame/frame-tests.ios.ts +++ b/tests/app/ui/frame/frame-tests.ios.ts @@ -1,9 +1,8 @@ import * as frameModule from "ui/frame"; import * as TKUnit from "../../TKUnit"; +import * as uiUtils from "ui/utils"; import { PercentLength, unsetValue } from "ui/core/view"; -var uiUtils = require("ui/utils"); - export function test_percent_width_and_height_set_to_page_support() { let topFrame = frameModule.topmost(); let currentPage = topFrame.currentPage; @@ -33,31 +32,49 @@ export function test_percent_width_and_height_set_to_page_support() { } export function test_percent_margin_set_to_page_support() { - let topFrame = frameModule.topmost(); - let currentPage = topFrame.currentPage; + percent_margin_set_to_page_support(false); +} + +export function test_percent_margin_set_to_page_support_with_backgroundSpanUnderStatusBar() { + percent_margin_set_to_page_support(true); +} + +function percent_margin_set_to_page_support(backgroundSpanUnderStatusBar: boolean) { + const topFrame = frameModule.topmost(); + const currentPage = topFrame.currentPage; + + const topFrameWidth = topFrame.getMeasuredWidth(); + const topFrameHeight = topFrame.getMeasuredHeight(); + const statusBar = backgroundSpanUnderStatusBar ? 0 : uiUtils.ios.getStatusBarHeight(); + currentPage.margin = "10%"; + currentPage.backgroundSpanUnderStatusBar = backgroundSpanUnderStatusBar; TKUnit.waitUntilReady(() => { return currentPage.isLayoutValid; }, 1); - let topFrameWidth = topFrame.getMeasuredWidth(); - let topFrameHeight = topFrame.getMeasuredHeight(); + const currentPageWidth = currentPage.getMeasuredWidth(); + const currentPageHeight = currentPage.getMeasuredHeight(); + const marginWidth = Math.round(topFrameWidth * 0.1); + const marginHeight = Math.round((topFrameHeight - statusBar) * 0.1); - let currentPageWidth = currentPage.getMeasuredWidth(); - let currentPageHeight = currentPage.getMeasuredHeight() + // expected page size + TKUnit.assertEqual(currentPageWidth, topFrameWidth - 2 * marginWidth, "Page measure width"); + TKUnit.assertEqual(currentPageHeight, topFrameHeight - 2 * marginHeight - statusBar, "Page measure height"); - let marginLeft = topFrameWidth * 0.1; - let marginTop = topFrameHeight * 0.1 + uiUtils.ios.getStatusBarHeight(); - - let bounds = currentPage._getCurrentLayoutBounds(); - TKUnit.assertEqual(bounds.left, Math.round(marginLeft), "Current page LEFT position incorrect"); - TKUnit.assertEqual(bounds.top, Math.round(marginTop), "Current page TOP position incorrect"); - TKUnit.assertEqual(bounds.right, Math.round(marginLeft + currentPageWidth), "Current page RIGHT position incorrect"); - TKUnit.assertEqual(bounds.bottom, Math.round(marginTop + currentPageHeight), "Current page BOTTOM position incorrect"); + // expected page bounds + const bounds = currentPage._getCurrentLayoutBounds(); + TKUnit.assertEqual(bounds.left, Math.round(marginWidth), "Current page LEFT position incorrect"); + TKUnit.assertEqual(bounds.top, Math.round(marginHeight + statusBar), "Current page TOP position incorrect"); + TKUnit.assertEqual(bounds.right, Math.round(marginWidth + currentPageWidth), "Current page RIGHT position incorrect"); + TKUnit.assertEqual(bounds.bottom, Math.round(marginHeight + statusBar + currentPageHeight), "Current page BOTTOM position incorrect"); //reset values. currentPage.margin = "0"; + TKUnit.waitUntilReady(() => { + return currentPage.isLayoutValid; + }, 1); TKUnit.assertTrue(PercentLength.equals(currentPage.marginLeft, 0)); TKUnit.assertTrue(PercentLength.equals(currentPage.marginTop, 0)); diff --git a/tns-core-modules/ui/core/view-base.ts b/tns-core-modules/ui/core/view-base.ts index 0576f0be9..be0e01b1c 100644 --- a/tns-core-modules/ui/core/view-base.ts +++ b/tns-core-modules/ui/core/view-base.ts @@ -69,7 +69,7 @@ export function getViewById(view: ViewBaseDefinition, id: string): ViewBaseDefin } return true; - } + }; eachDescendant(view, descendantsCallback); return retVal; @@ -87,7 +87,7 @@ export function eachDescendant(view: ViewBaseDefinition, callback: (child: ViewB child.eachChild(localCallback); } return continueIteration; - } + }; view.eachChild(localCallback); } @@ -95,7 +95,6 @@ export function eachDescendant(view: ViewBaseDefinition, callback: (child: ViewB let viewIdCounter = 0; export class ViewBase extends Observable implements ViewBaseDefinition { - private _updatingJSPropertiesDict = {}; private _style: Style; private _isLoaded: boolean; private _registeredAnimations: Array; @@ -225,7 +224,7 @@ export class ViewBase extends Observable implements ViewBaseDefinition { next.changeMap.forEach((changes, view) => { if (changes.attributes) { changes.attributes.forEach(attribute => { - view.addEventListener(attribute + "Change", this._invalidateCssHandler) + view.addEventListener(attribute + "Change", this._invalidateCssHandler); }); } if (changes.pseudoClasses) { @@ -244,13 +243,13 @@ export class ViewBase extends Observable implements ViewBaseDefinition { previous.changeMap.forEach((changes, view) => { if (changes.attributes) { changes.attributes.forEach(attribute => { - view.removeEventListener("onPropertyChanged:" + attribute, this._invalidateCssHandler) + view.removeEventListener("onPropertyChanged:" + attribute, this._invalidateCssHandler); }); } if (changes.pseudoClasses) { changes.pseudoClasses.forEach(pseudoClass => { let eventName = ":" + pseudoClass; - view.removeEventListener(eventName, this._invalidateCssHandler) + view.removeEventListener(eventName, this._invalidateCssHandler); if (view[eventName]) { view[eventName](-1); } diff --git a/tns-core-modules/ui/core/view-common.ts b/tns-core-modules/ui/core/view-common.ts index 0fbda5360..065ca06dd 100644 --- a/tns-core-modules/ui/core/view-common.ts +++ b/tns-core-modules/ui/core/view-common.ts @@ -685,7 +685,7 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition { let style = child.style; let horizontalMargins = child.effectiveMarginLeft + child.effectiveMarginRight; - let verticalMargins = child.effectiveMarginTop + child.effectiveMarginRight; + let verticalMargins = child.effectiveMarginTop + child.effectiveMarginBottom; let childWidthMeasureSpec = ViewCommon.getMeasureSpec(width, widthMode, horizontalMargins, child.effectiveWidth, style.horizontalAlignment === HorizontalAlignment.STRETCH); let childHeightMeasureSpec = ViewCommon.getMeasureSpec(height, heightMode, verticalMargins, child.effectiveHeight, style.verticalAlignment === VerticalAlignment.STRETCH); diff --git a/tns-core-modules/ui/page/page.android.ts b/tns-core-modules/ui/page/page.android.ts index 1301186dd..82981eacf 100644 --- a/tns-core-modules/ui/page/page.android.ts +++ b/tns-core-modules/ui/page/page.android.ts @@ -183,7 +183,7 @@ export class Page extends PageBase { return { color: (window).getStatusBarColor(), systemUiVisibility: decorView.getSystemUiVisibility() - } + }; } return null; diff --git a/tns-core-modules/ui/page/page.ios.ts b/tns-core-modules/ui/page/page.ios.ts index f961c7021..5973f5363 100644 --- a/tns-core-modules/ui/page/page.ios.ts +++ b/tns-core-modules/ui/page/page.ios.ts @@ -1,7 +1,7 @@ import { PageBase, View, layout, actionBarHiddenProperty, statusBarStyleProperty, - traceEnabled, traceWrite, traceCategories + traceEnabled, traceWrite, traceCategories, PercentLength } from "./page-common"; import { ios as iosApp } from "application"; import { device } from "platform"; @@ -476,6 +476,23 @@ export class Page extends PageBase { } } + public _updateEffectiveLayoutValues(parent: View): void { + super._updateEffectiveLayoutValues(parent); + + // Patch vertical margins to respect status bar height + if (!this.backgroundSpanUnderStatusBar) { + const style = this.style; + + let parentHeightMeasureSpec = parent._currentHeightMeasureSpec; + let parentHeightMeasureSize = layout.getMeasureSpecSize(parentHeightMeasureSpec) - uiUtils.ios.getStatusBarHeight(); + let parentHeightMeasureMode = layout.getMeasureSpecMode(parentHeightMeasureSpec); + let parentAvailableHeight = parentHeightMeasureMode === layout.UNSPECIFIED ? -1 : parentHeightMeasureSize; + + this.effectiveMarginTop = PercentLength.toDevicePixels(style.marginTop, 0, parentAvailableHeight); + this.effectiveMarginBottom = PercentLength.toDevicePixels(style.marginBottom, 0, parentAvailableHeight); + } + } + public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number) { let width = layout.getMeasureSpecSize(widthMeasureSpec); let widthMode = layout.getMeasureSpecMode(widthMeasureSpec);