diff --git a/tests/app/ui/styling/root-views-css-classes-tests.ts b/tests/app/ui/styling/root-views-css-classes-tests.ts index aa636f92b..b259f57b5 100644 --- a/tests/app/ui/styling/root-views-css-classes-tests.ts +++ b/tests/app/ui/styling/root-views-css-classes-tests.ts @@ -22,6 +22,7 @@ import { } from "tns-core-modules/ui/core/view/view-common"; import { DeviceType } from "tns-core-modules/ui/enums/enums"; +const CLASS_NAME = "class-name"; const ROOT_CSS_CLASS = "ns-root"; const MODAL_CSS_CLASS = "ns-modal"; const ANDROID_PLATFORM_CSS_CLASS = "ns-android"; @@ -32,18 +33,41 @@ const PORTRAIT_ORIENTATION_CSS_CLASS = "ns-portrait"; const LANDSCAPE_ORIENTATION_CSS_CLASS = "ns-landscape"; const UNKNOWN_ORIENTATION_CSS_CLASS = "ns-unknown"; -export function test_root_view_root_css_class() { - const rootViewCssClasses = getRootView().cssClasses; +function _test_root_view_root_css_class(shouldSetClassName: boolean) { + const rootView = getRootView(); + if (shouldSetClassName) { + rootView.className = CLASS_NAME; + } + const rootViewCssClasses = rootView.cssClasses; TKUnit.assertTrue(rootViewCssClasses.has( ROOT_CSS_CLASS), `${ROOT_CSS_CLASS} CSS class is missing` ); + + if (shouldSetClassName) { + TKUnit.assertTrue(rootViewCssClasses.has( + CLASS_NAME), + `${CLASS_NAME} CSS class is missing` + ); + } } -export function test_root_view_platform_css_class() { - const rootViewCssClasses = getRootView().cssClasses; +export function test_root_view_root_css_class() { + _test_root_view_root_css_class(false); +} +export function test_root_view_class_name_preserve_root_css_class() { + _test_root_view_root_css_class(true); +} + +function _test_root_view_platform_css_class(shouldSetClassName: boolean) { + const rootView = getRootView(); + if (shouldSetClassName) { + rootView.className = CLASS_NAME; + } + + const rootViewCssClasses = rootView.cssClasses; if (isAndroid) { TKUnit.assertTrue(rootViewCssClasses.has( ANDROID_PLATFORM_CSS_CLASS), @@ -63,10 +87,30 @@ export function test_root_view_platform_css_class() { `${ANDROID_PLATFORM_CSS_CLASS} CSS class is present` ); } + + if (shouldSetClassName) { + TKUnit.assertTrue(rootViewCssClasses.has( + CLASS_NAME), + `${CLASS_NAME} CSS class is missing` + ); + } } -export function test_root_view_device_type_css_class() { - const rootViewCssClasses = getRootView().cssClasses; +export function test_root_view_platform_css_class() { + _test_root_view_platform_css_class(false); +} + +export function test_root_view_class_name_preserve_platform_css_class() { + _test_root_view_platform_css_class(true); +} + +function _test_root_view_device_type_css_class(shouldSetClassName: boolean) { + const rootView = getRootView(); + if (shouldSetClassName) { + rootView.className = CLASS_NAME; + } + + const rootViewCssClasses = rootView.cssClasses; const deviceType = device.deviceType; if (deviceType === DeviceType.Phone) { @@ -88,10 +132,30 @@ export function test_root_view_device_type_css_class() { `${PHONE_DEVICE_TYPE_CSS_CLASS} CSS class is present` ); } + + if (shouldSetClassName) { + TKUnit.assertTrue(rootViewCssClasses.has( + CLASS_NAME), + `${CLASS_NAME} CSS class is missing` + ); + } } -export function test_root_view_orientation_css_class() { - const rootViewCssClasses = getRootView().cssClasses; +export function test_root_view_device_type_css_class() { + _test_root_view_device_type_css_class(false); +} + +export function test_root_view_class_name_preserve_device_type_css_class() { + _test_root_view_device_type_css_class(true); +} + +function _test_root_view_orientation_css_class(shouldSetClassName: boolean) { + const rootView = getRootView(); + if (shouldSetClassName) { + rootView.className = CLASS_NAME; + } + + const rootViewCssClasses = rootView.cssClasses; let appOrientation; if (isAndroid) { @@ -140,9 +204,24 @@ export function test_root_view_orientation_css_class() { `${PORTRAIT_ORIENTATION_CSS_CLASS} CSS class is present` ); } + + if (shouldSetClassName) { + TKUnit.assertTrue(rootViewCssClasses.has( + CLASS_NAME), + `${CLASS_NAME} CSS class is missing` + ); + } } -export function test_modal_root_view_modal_css_class() { +export function test_root_view_orientation_css_class() { + _test_root_view_orientation_css_class(false); +} + +export function test_root_view_class_name_preserve_orientation_css_class() { + _test_root_view_orientation_css_class(true); +} + +function _test_modal_root_view_modal_css_class(shouldSetClassName: boolean) { let modalClosed = false; const modalCloseCallback = function () { @@ -153,7 +232,20 @@ export function test_modal_root_view_modal_css_class() { const page = args.object; page.off(View.shownModallyEvent, modalPageShownModallyEventHandler); - TKUnit.assertTrue(_rootModalViews[0].cssClasses.has(MODAL_CSS_CLASS)); + const rootModalView = _rootModalViews[0]; + if (shouldSetClassName) { + rootModalView.className = CLASS_NAME; + } + + const rootModalViewCssClasses = rootModalView.cssClasses; + TKUnit.assertTrue(rootModalViewCssClasses.has(MODAL_CSS_CLASS), + `${MODAL_CSS_CLASS} CSS class is missing`); + + if (shouldSetClassName) { + TKUnit.assertTrue(rootModalViewCssClasses.has(CLASS_NAME), + `${CLASS_NAME} CSS class is missing`); + } + args.closeCallback(); }; @@ -186,3 +278,11 @@ export function test_modal_root_view_modal_css_class() { helper.navigate(hostPageFactory); TKUnit.waitUntilReady(() => modalClosed); } + +export function test_modal_root_view_modal_css_class() { + _test_modal_root_view_modal_css_class(false); +} + +export function test_modal_root_view_class_name_preserve_modal_css_class() { + _test_modal_root_view_modal_css_class(true); +} diff --git a/tests/app/ui/styling/style-tests.ts b/tests/app/ui/styling/style-tests.ts index d3c5cfa3d..004ddeacd 100644 --- a/tests/app/ui/styling/style-tests.ts +++ b/tests/app/ui/styling/style-tests.ts @@ -225,7 +225,7 @@ export function test_multiple_class_selector() { let page = helper.getClearCurrentPage(); let btnWithClasses: buttonModule.Button; - page.css = ".style1 { color: red; } .style2 { background-color: blue } "; + page.css = ".style1 { color: red; } .style2 { background-color: blue; } "; //// Will be styled btnWithClasses = new buttonModule.Button(); @@ -239,6 +239,24 @@ export function test_multiple_class_selector() { helper.assertViewBackgroundColor(btnWithClasses, "#0000FF"); } +export function test_class_selector_overwriting() { + const page = helper.getClearCurrentPage(); + page.css = ".first { color: red; } .second { background-color: blue; }"; + + const btnWithClass = new buttonModule.Button(); + const stack = new stackModule.StackLayout(); + page.content = stack; + stack.addChild(btnWithClass); + + btnWithClass.className = "first"; + helper.assertViewColor(btnWithClass, "#FF0000"); + TKUnit.assert(btnWithClass.style.backgroundColor === undefined, " Background color should not have a value"); + + btnWithClass.className = "second"; + TKUnit.assert(btnWithClass.style.color === undefined, "Color should not have a value"); + helper.assertViewBackgroundColor(btnWithClass, "#0000FF"); +} + export function test_id_selector() { let page = helper.getClearCurrentPage(); page.style.color = unsetValue; @@ -1497,7 +1515,7 @@ export function test_css_calc() { TKUnit.assertEqual(stack.width as any, 125, "Stack - width === 125"); (stack as any).style = `width: calc(100% / 2)`; - TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); + TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); // This should log an error for the invalid css-calc expression, but not cause a crash stack.className = "invalid-css-calc"; @@ -1568,7 +1586,7 @@ export function test_nested_css_calc() { (stack as any).style = `width: calc(100% * calc(1 / 2)`; - TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); + TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); } export function test_css_variables() { @@ -1678,7 +1696,7 @@ export function test_css_calc_and_variables() { // Test setting the CSS variable via the style-attribute, this should override any value set via css-class (stack as any).style = `${cssVarName}: 0.5`; - TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); + TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); } export function test_css_variable_fallback() { @@ -1819,10 +1837,10 @@ export function test_nested_css_calc_and_variables() { // Test setting the CSS variable via the style-attribute, this should override any value set via css-class stack.className = "wide"; (stack as any).style = `${cssVarName}: 0.25`; - TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); + TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 0.5 }, "Stack - width === 50%"); stack.className = "nested"; - TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 1 }, "Stack - width === 100%"); + TKUnit.assertDeepEqual(stack.width, { unit: "%", value: 1 }, "Stack - width === 100%"); } export function test_css_variable_is_applied_to_normal_properties() { diff --git a/tns-core-modules/application/application-common.ts b/tns-core-modules/application/application-common.ts index 6c6a92de4..c59774ea2 100644 --- a/tns-core-modules/application/application-common.ts +++ b/tns-core-modules/application/application-common.ts @@ -40,6 +40,8 @@ import { LoadAppCSSEventData, UnhandledErrorEventData } from "./application"; + +import { CLASS_PREFIX, pushToRootViewCssClasses, removeFromRootViewCssClasses } from "../css/system-classes"; import { DeviceOrientation } from "../ui/enums/enums"; export { UnhandledErrorEventData, DiscardedErrorEventData, CssChangedEventData, LoadAppCSSEventData }; @@ -54,11 +56,10 @@ export const uncaughtErrorEvent = "uncaughtError"; export const discardedErrorEvent = "discardedError"; export const orientationChangedEvent = "orientationChanged"; -export const CSS_CLASS_PREFIX = "ns-"; const ORIENTATION_CSS_CLASSES = [ - `${CSS_CLASS_PREFIX}${DeviceOrientation.portrait}`, - `${CSS_CLASS_PREFIX}${DeviceOrientation.landscape}`, - `${CSS_CLASS_PREFIX}${DeviceOrientation.unknown}` + `${CLASS_PREFIX}${DeviceOrientation.portrait}`, + `${CLASS_PREFIX}${DeviceOrientation.landscape}`, + `${CLASS_PREFIX}${DeviceOrientation.unknown}` ]; let cssFile: string = "./app.css"; @@ -126,9 +127,15 @@ export function loadAppCss(): void { } export function orientationChanged(rootView: View, newOrientation: "portrait" | "landscape" | "unknown"): void { - const newOrientationCssClass = `${CSS_CLASS_PREFIX}${newOrientation}`; + const newOrientationCssClass = `${CLASS_PREFIX}${newOrientation}`; if (!rootView.cssClasses.has(newOrientationCssClass)) { - ORIENTATION_CSS_CLASSES.forEach(c => rootView.cssClasses.delete(c)); + const removeCssClass = (c: string) => { + removeFromRootViewCssClasses(c); + rootView.cssClasses.delete(c); + }; + + ORIENTATION_CSS_CLASSES.forEach(c => removeCssClass(c)); + pushToRootViewCssClasses(newOrientationCssClass); rootView.cssClasses.add(newOrientationCssClass); rootView._onCssStateChange(); } diff --git a/tns-core-modules/application/application.d.ts b/tns-core-modules/application/application.d.ts index 8ef338b76..672e55cc5 100644 --- a/tns-core-modules/application/application.d.ts +++ b/tns-core-modules/application/application.d.ts @@ -53,11 +53,6 @@ export const lowMemoryEvent: string; */ export const orientationChangedEvent: string; -/** - * String value "ns-" used for CSS class prefix. - */ -export const CSS_CLASS_PREFIX: string; - /** * Event data containing information for the application events. */ diff --git a/tns-core-modules/application/application.ios.ts b/tns-core-modules/application/application.ios.ts index 49e9b80cb..37a834096 100644 --- a/tns-core-modules/application/application.ios.ts +++ b/tns-core-modules/application/application.ios.ts @@ -1,4 +1,3 @@ - import { ApplicationEventData, CssChangedEventData, @@ -9,9 +8,8 @@ import { } from "."; import { - CSS_CLASS_PREFIX, displayedEvent, exitEvent, getCssFileName, launchEvent, livesync, - lowMemoryEvent, notify, on, orientationChanged, orientationChangedEvent, resumeEvent, - setApplication, suspendEvent + displayedEvent, exitEvent, getCssFileName, launchEvent, livesync, lowMemoryEvent, notify, on, + orientationChanged, orientationChangedEvent, resumeEvent, setApplication, suspendEvent } from "./application-common"; // First reexport so that app module is initialized. @@ -19,18 +17,15 @@ export * from "./application-common"; // TODO: Remove this and get it from global to decouple builder for angular import { createViewFromEntry } from "../ui/builder"; +import { CLASS_PREFIX, getRootViewCssClasses, pushToRootViewCssClasses } from "../css/system-classes"; import { ios as iosView, View } from "../ui/core/view"; import { Frame, NavigationEntry } from "../ui/frame"; import { device } from "../platform/platform"; import { profile } from "../profiling"; import { ios } from "../utils/utils"; -const ROOT = "root"; const IOS_PLATFORM = "ios"; -const ROOT_VIEW_CSS_CLASSES = [ - `${CSS_CLASS_PREFIX}${ROOT}`, - `${CSS_CLASS_PREFIX}${IOS_PLATFORM}` -]; + const getVisibleViewController = ios.getVisibleViewController; // NOTE: UIResponder with implementation of window - related to https://github.com/NativeScript/ios-runtime/issues/430 @@ -317,9 +312,12 @@ function createRootView(v?: View) { } const deviceType = device.deviceType.toLowerCase(); - ROOT_VIEW_CSS_CLASSES.push(`${CSS_CLASS_PREFIX}${deviceType}`); - ROOT_VIEW_CSS_CLASSES.push(`${CSS_CLASS_PREFIX}${iosApp.orientation}`); - ROOT_VIEW_CSS_CLASSES.forEach(c => rootView.cssClasses.add(c)); + pushToRootViewCssClasses(`${CLASS_PREFIX}${IOS_PLATFORM}`); + pushToRootViewCssClasses(`${CLASS_PREFIX}${deviceType}`); + pushToRootViewCssClasses(`${CLASS_PREFIX}${iosApp.orientation}`); + + const rootViewCssClasses = getRootViewCssClasses(); + rootViewCssClasses.forEach(c => rootView.cssClasses.add(c)); return rootView; } diff --git a/tns-core-modules/css/system-classes.d.ts b/tns-core-modules/css/system-classes.d.ts new file mode 100644 index 000000000..98f7ee59e --- /dev/null +++ b/tns-core-modules/css/system-classes.d.ts @@ -0,0 +1,30 @@ +/** + * @module "system-classes" + */ /** */ + +/** + * String value "ns-" used for CSS system class prefix. + */ +export const CLASS_PREFIX: string; + +/** + * Gets CSS system class for modal root view. + */ +export function getModalRootViewCssClass(): string; + +/** + * Gets CSS system classes for root view. + */ +export function getRootViewCssClasses(): string[]; + +/** + * * Appends new CSS class to the system classes and returns the new length of the array. + * @param value New CSS system class. + */ +export function pushToRootViewCssClasses(value: string): number; + +/** + * Removes CSS class from the system classes and returns it. + * @param value + */ +export function removeFromRootViewCssClasses(value: string): string; diff --git a/tns-core-modules/css/system-classes.ts b/tns-core-modules/css/system-classes.ts new file mode 100644 index 000000000..6e2f7e80c --- /dev/null +++ b/tns-core-modules/css/system-classes.ts @@ -0,0 +1,32 @@ +const MODAL = "modal"; +const ROOT = "root"; + +export const CLASS_PREFIX = "ns-"; + +const modalRootViewCssClass = `${CLASS_PREFIX}${MODAL}`; +const rootViewCssClasses = [`${CLASS_PREFIX}${ROOT}`]; + +export function getModalRootViewCssClass(): string { + return modalRootViewCssClass; +} + +export function getRootViewCssClasses(): string[] { + return rootViewCssClasses; +} + +export function pushToRootViewCssClasses(value: string): number { + rootViewCssClasses.push(value); + + return rootViewCssClasses.length; +} + +export function removeFromRootViewCssClasses(value: string): string { + const index = rootViewCssClasses.indexOf(value); + let removedElement; + + if (index > -1) { + removedElement = rootViewCssClasses.splice(index, 1); + } + + return removedElement; +} diff --git a/tns-core-modules/ui/core/view-base/view-base.ts b/tns-core-modules/ui/core/view-base/view-base.ts index 06ec4c996..89dc23607 100644 --- a/tns-core-modules/ui/core/view-base/view-base.ts +++ b/tns-core-modules/ui/core/view-base/view-base.ts @@ -1,10 +1,13 @@ // Definitions. import { ViewBase as ViewBaseDefinition } from "."; +import { + AlignSelf, FlexGrow, FlexShrink, FlexWrapBefore, Order +} from "../../layouts/flexbox-layout"; import { Page } from "../../page"; -import { Order, FlexGrow, FlexShrink, FlexWrapBefore, AlignSelf } from "../../layouts/flexbox-layout"; // Types. import { Property, CssProperty, CssAnimationProperty, InheritedProperty, Style, clearInheritedProperties, propagateInheritableProperties, propagateInheritableCssProperties, initNativeView } from "../properties"; +import { getModalRootViewCssClass, getRootViewCssClasses } from "../../../css/system-classes"; import { Source } from "../../../utils/debug"; import { Binding, BindingOptions, Observable, WrappedValue, PropertyChangeData, traceEnabled, traceWrite, traceCategories } from "../bindable"; import { isIOS, isAndroid } from "../../../platform"; @@ -22,10 +25,9 @@ export { isIOS, isAndroid, layout, Color }; export * from "../bindable"; export * from "../properties"; +import * as dnm from "../../../debugger/dom-node"; import * as ssm from "../../styling/style-scope"; -// import { DOMNode } from "../../../debugger/dom-node"; -import * as dnm from "../../../debugger/dom-node"; let domNodeModule: typeof dnm; function ensuredomNodeModule(): void { @@ -1036,11 +1038,26 @@ bindingContextProperty.register(ViewBase); export const classNameProperty = new Property({ name: "className", valueChanged(view: ViewBase, oldValue: string, newValue: string) { - let classes = view.cssClasses; - classes.clear(); - if (typeof newValue === "string" && newValue !== "") { - newValue.split(" ").forEach(c => classes.add(c)); + const cssClasses = view.cssClasses; + + const modalViewCssClass = getModalRootViewCssClass(); + const rootViewCssClasses = getRootViewCssClasses(); + + const shouldAddModalRootViewCssClass = cssClasses.has(modalViewCssClass); + const shouldAddRootViewCssClasses = cssClasses.has(rootViewCssClasses[0]); + + cssClasses.clear(); + + if (shouldAddModalRootViewCssClass) { + cssClasses.add(modalViewCssClass); + } else if (shouldAddRootViewCssClasses) { + rootViewCssClasses.forEach(c => cssClasses.add(c)); } + + if (typeof newValue === "string" && newValue !== "") { + newValue.split(" ").forEach(c => cssClasses.add(c)); + } + view._onCssStateChange(); } }); @@ -1058,4 +1075,4 @@ export function booleanConverter(v: string): boolean { } throw new Error(`Invalid boolean: ${v}`); -} \ No newline at end of file +} diff --git a/tns-core-modules/ui/core/view/view-common.ts b/tns-core-modules/ui/core/view/view-common.ts index d09e09929..4e9352358 100644 --- a/tns-core-modules/ui/core/view/view-common.ts +++ b/tns-core-modules/ui/core/view/view-common.ts @@ -5,9 +5,8 @@ import { } from "."; import { - ViewBase, Property, booleanConverter, EventData, layout, - getEventOrGestureName, traceEnabled, traceWrite, traceCategories, - InheritedProperty, ShowModalOptions + booleanConverter, EventData, getEventOrGestureName, InheritedProperty, layout, + Property, ShowModalOptions, traceCategories, traceEnabled, traceWrite, ViewBase } from "../view-base"; import { HorizontalAlignment, VerticalAlignment, Visibility, Length, PercentLength } from "../../styling/style-properties"; @@ -20,6 +19,7 @@ import { fromString as gestureFromString } from "../../gestures"; +import { getModalRootViewCssClass } from "../../../css/system-classes"; import { createViewFromEntry } from "../../builder"; import { sanitizeModuleName } from "../../builder/module-name-sanitizer"; import { StyleScope } from "../../styling/style-scope"; @@ -31,9 +31,6 @@ export * from "../view-base"; export { LinearGradient }; import * as am from "../../animation"; -import { CSS_CLASS_PREFIX } from "../../../application"; - -const MODAL = "modal"; let animationModule: typeof am; function ensureAnimationModule() { @@ -373,7 +370,9 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition { protected _showNativeModalView(parent: ViewCommon, options: ShowModalOptions) { _rootModalViews.push(this); - this.cssClasses.add(`${CSS_CLASS_PREFIX}${MODAL}`); + + const modalRootViewCssClass = getModalRootViewCssClass(); + this.cssClasses.add(modalRootViewCssClass); parent._modal = this; this._modalParent = parent; diff --git a/tns-core-modules/ui/frame/frame.android.ts b/tns-core-modules/ui/frame/frame.android.ts index f93d9a874..fc52f37b8 100644 --- a/tns-core-modules/ui/frame/frame.android.ts +++ b/tns-core-modules/ui/frame/frame.android.ts @@ -7,9 +7,10 @@ import { Page } from "../page"; // Types. import * as application from "../../application"; + import { - FrameBase, goBack, _stack, NavigationType, - Observable, View, traceCategories, traceEnabled, traceError, traceWrite + _stack, FrameBase, goBack, NavigationType, Observable, + traceCategories, traceEnabled, traceError, traceWrite, View } from "./frame-common"; import { @@ -19,6 +20,7 @@ import { // TODO: Remove this and get it from global to decouple builder for angular import { createViewFromEntry } from "../builder"; +import { CLASS_PREFIX, getRootViewCssClasses, pushToRootViewCssClasses } from "../../css/system-classes"; import { device } from "../../platform/platform"; import { profile } from "../../profiling"; @@ -32,12 +34,7 @@ interface AnimatorState { transitionName: string; } -const ROOT = "root"; const ANDROID_PLATFORM = "android"; -const ROOT_VIEW_CSS_CLASSES = [ - `${application.CSS_CLASS_PREFIX}${ROOT}`, - `${application.CSS_CLASS_PREFIX}${ANDROID_PLATFORM}` -]; const INTENT_EXTRA = "com.tns.activity"; const ROOT_VIEW_ID_EXTRA = "com.tns.activity.rootViewId"; @@ -1289,9 +1286,12 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks { activityRootViewsMap.set(rootView._domId, new WeakRef(rootView)); const deviceType = device.deviceType.toLowerCase(); - ROOT_VIEW_CSS_CLASSES.push(`${application.CSS_CLASS_PREFIX}${deviceType}`); - ROOT_VIEW_CSS_CLASSES.push(`${application.CSS_CLASS_PREFIX}${application.android.orientation}`); - ROOT_VIEW_CSS_CLASSES.forEach(c => this._rootView.cssClasses.add(c)); + pushToRootViewCssClasses(`${CLASS_PREFIX}${ANDROID_PLATFORM}`); + pushToRootViewCssClasses(`${CLASS_PREFIX}${deviceType}`); + pushToRootViewCssClasses(`${CLASS_PREFIX}${application.android.orientation}`); + + const rootViewCssClasses = getRootViewCssClasses(); + rootViewCssClasses.forEach(c => this._rootView.cssClasses.add(c)); } // Initialize native visual tree; diff --git a/tns-core-modules/ui/utils.android.ts b/tns-core-modules/ui/utils.android.ts index b253eba9e..b8e7bc80b 100644 --- a/tns-core-modules/ui/utils.android.ts +++ b/tns-core-modules/ui/utils.android.ts @@ -10,4 +10,4 @@ export function _layoutRootView(rootView: any, parentBounds: any) { throw new Error("Not implemented for Android"); } -} \ No newline at end of file +} diff --git a/tns-core-modules/ui/utils.d.ts b/tns-core-modules/ui/utils.d.ts index e54e208bd..a30b9f6f3 100644 --- a/tns-core-modules/ui/utils.d.ts +++ b/tns-core-modules/ui/utils.d.ts @@ -3,6 +3,7 @@ */ import { View } from "./core/view"; + export module ios { /** * Gets actual height of a [UIView](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIView_Class/) widget in device pixels. diff --git a/tns-core-modules/ui/utils.ios.ts b/tns-core-modules/ui/utils.ios.ts index 21ed98575..de61713bb 100644 --- a/tns-core-modules/ui/utils.ios.ts +++ b/tns-core-modules/ui/utils.ios.ts @@ -24,4 +24,4 @@ export module ios { return utils.layout.toDevicePixels(min); } -} \ No newline at end of file +}