stylers removed

ui/styling/background.android.ts

@@ -1,6 +1,12 @@
 import utils = require("utils/utils");
 import common = require("./background-common");
 import dts = require("ui/styling/background");
+import view = require("ui/core/view");
+import types = require("utils/types");
+import * as styleModule from "./style";
+import * as buttonModule from "ui/button";
+
+var btn: typeof buttonModule;
 
 global.moduleMerge(common, exports);
 
@@ -128,4 +134,77 @@ export module ad {
             }
         }
     }
+
+    var SDK = android.os.Build.VERSION.SDK_INT;
+
+    var _defaultBackgrounds = new Map<string, android.graphics.drawable.Drawable>();
+
+    export function onBackgroundOrBorderPropertyChanged(v: view.View) {
+        if (!btn) {
+            btn = require("ui/button");
+        }
+
+        var nativeView = <android.view.View>v._nativeView;
+        if (!nativeView) {
+            return;
+        }
+
+        var style: typeof styleModule = require("./style");
+
+        var backgroundValue = v.style._getValue(style.backgroundInternalProperty);
+        var borderWidth = v.borderWidth;
+        if (v.borderWidth !== 0 || v.borderRadius !== 0 || !backgroundValue.isEmpty()) {
+
+            var bkg = <any>nativeView.getBackground();
+            if (!(bkg instanceof dts.ad.BorderDrawable)) {
+                bkg = new dts.ad.BorderDrawable();
+                let viewClass = types.getClass(v);
+                if (!(v instanceof btn.Button) && !_defaultBackgrounds.has(viewClass)) {
+                    _defaultBackgrounds.set(viewClass, nativeView.getBackground());
+                }
+
+                nativeView.setBackground(bkg);
+            }
+
+            bkg.borderWidth = v.borderWidth;
+            bkg.cornerRadius = v.borderRadius;
+            bkg.borderColor = v.borderColor ? v.borderColor.android : android.graphics.Color.TRANSPARENT;
+            bkg.background = backgroundValue;
+
+            if (SDK < 18) {
+                // Switch to software because of unsupported canvas methods if hardware acceleration is on:
+                // http://developer.android.com/guide/topics/graphics/hardware-accel.html
+                nativeView.setLayerType(android.view.View.LAYER_TYPE_SOFTWARE, null);
+            }
+            else {
+                nativeView.setLayerType(android.view.View.LAYER_TYPE_HARDWARE, null);
+            }
+        }
+        else {
+            // reset the value with the default native value
+            if (v instanceof btn.Button) {
+                var nativeButton = new android.widget.Button(nativeView.getContext());
+                nativeView.setBackground(nativeButton.getBackground());
+            }
+            else {
+                let viewClass = types.getClass(v);
+                if (_defaultBackgrounds.has(viewClass)) {
+                    nativeView.setBackground(_defaultBackgrounds.get(viewClass));
+                }
+            }
+
+            if (SDK < 18) {
+                // Reset layer type to hardware
+                nativeView.setLayerType(android.view.View.LAYER_TYPE_HARDWARE, null);
+            }
+        }
+
+        var density = utils.layout.getDisplayDensity();
+        nativeView.setPadding(
+            Math.round((borderWidth + v.style.paddingLeft) * density),
+            Math.round((borderWidth + v.style.paddingTop) * density),
+            Math.round((borderWidth + v.style.paddingRight) * density),
+            Math.round((borderWidth + v.style.paddingBottom) * density)
+        );
+    }
 }

ui/styling/background.d.ts

@@ -46,4 +46,8 @@ declare module "ui/styling/background" {
     export module ios {
         export function createBackgroundUIColor(view: viewModule.View, flip?: boolean): any /* UIColor */;
     }
+
+    export module ad {
+        export function onBackgroundOrBorderPropertyChanged(v: viewModule.View);
+    }
 }

ui/styling/style.d.ts

@@ -4,7 +4,6 @@ declare module "ui/styling/style" {
     import {DependencyObservable, Property} from "ui/core/dependency-observable";
     import {View} from "ui/core/view";
     import {Color} from "color";
-    import stylers = require("ui/styling/stylers");
     import styleProperty = require("ui/styling/style-property");
 
     export interface Thickness {
@@ -87,10 +86,8 @@ declare module "ui/styling/style" {
         public _updateTextTransform(): void;
     }
 
-    export function registerHandler(property: Property, handler: styling.stylers.StylePropertyChangedHandler, className?: string);
-
     export function registerNoStylingClass(className);
-    export function getHandler(property: Property, view: View): styling.stylers.StylePropertyChangedHandler;
+    export function getHandler(property: Property, view: View): StylePropertyChangedHandler;
     // Property registration
     export var colorProperty: styleProperty.Property;
     export var backgroundImageProperty: styleProperty.Property;
@@ -112,6 +109,9 @@ declare module "ui/styling/style" {
     export var minHeightProperty: styleProperty.Property;
     export var visibilityProperty: styleProperty.Property;
     export var opacityProperty: styleProperty.Property;
+    export var textDecorationProperty: styleProperty.Property;
+    export var textTransformProperty: styleProperty.Property;
+    export var whiteSpaceProperty: styleProperty.Property;
 
     // Helper property holding most layout related properties available in CSS.
     // When layout related properties are set in CSS we chache them and send them to the native view in a single call.
@@ -131,4 +131,40 @@ declare module "ui/styling/style" {
     export var paddingRightProperty: styleProperty.Property;
     export var paddingTopProperty: styleProperty.Property;
     export var paddingBottomProperty: styleProperty.Property;
+
+    /**
+     * Represents an object that defines how style property should be applied on a native view/widget.
+     */
+    export class StylePropertyChangedHandler {
+        /**
+         * Creates a new StylePropertyChangedHandler object.
+         * @param applyCallback - called when a property value should be applied onto the native view/widget.
+         * @param resetCallback - called when the property value is cleared to restore the native view/widget in its original state. The callback
+         * also receives as a parameter the value stored by the getNativeValue callback.
+         * @param getNativeValue - called when a style property is set for the first time to get the default native value for this property
+         * in the native view/widget. This value will be passed to resetCallback in case the property value is cleared. Optional.
+         */
+        constructor(applyCallback: (view: View, newValue: any) => void,
+            resetCallback: (view: View, nativeValue: any) => void,
+            getNativeValue?: (view: View) => any);
+    }
+
+    /**
+     * Represents a sceleton for an object that holds all style related callbacks and registers handlers.
+     * Used for better code readability.
+     */
+    export class Styler {
+        public static registerHandlers();
+    }
+
+    /**
+     * A function that actually registers a property with a StylePropertyChangedHandler.
+     * @param property - Usually a style dependency property which should be registered for style changes.
+     * @param handler - The handler that reacts on property changes.
+     * @param className(optional) - This parameter (when set) registers handler only for the class with that name and all its inheritors.
+     */
+    export function registerHandler(property: Property, handler: StylePropertyChangedHandler, className?: string);
+
+    export var ignorePropertyHandler;
+
 }

ui/styling/style.ts

@@ -1,10 +1,10 @@
-import styling = require("ui/styling");
+import application = require("application");
+import styling = require("ui/styling");
 import types = require("utils/types");
 import trace = require("trace");
 import {DependencyObservable, PropertyMetadata, PropertyMetadataSettings, PropertyChangeData, Property, ValueSource, NativeValueResult} from "ui/core/dependency-observable";
 import {View} from "ui/core/view";
 import {Color} from "color";
-import stylers = require("ui/styling/stylers");
 import styleProperty = require("ui/styling/style-property");
 import converters = require("./converters");
 import enums = require("ui/enums");
@@ -341,7 +341,7 @@ function onBackgroundPositionPropertyChanged(data: PropertyChangeData) {
     }
 }
 
-function getHandlerInternal(propertyId: number, classInfo: types.ClassInfo): styling.stylers.StylePropertyChangedHandler {
+function getHandlerInternal(propertyId: number, classInfo: types.ClassInfo): definition.StylePropertyChangedHandler {
     var className = classInfo ? classInfo.name : "default";
     var handlerKey = className + propertyId;
 
@@ -831,7 +831,7 @@ export class Style extends DependencyObservable implements styling.Style {
         }
 
         try {
-            var handler: styling.stylers.StylePropertyChangedHandler = getHandler(property, this._view);
+            var handler: definition.StylePropertyChangedHandler = getHandler(property, this._view);
 
             if (!handler) {
                 trace.write("No handler for property: " + property.name + " with id: " + property.id + ", view:" + this._view, trace.categories.Style);
@@ -902,7 +902,7 @@ export class Style extends DependencyObservable implements styling.Style {
     }
 }
 
-export function registerHandler(property: Property, handler: styling.stylers.StylePropertyChangedHandler, className?: string) {
+export function registerHandler(property: Property, handler: definition.StylePropertyChangedHandler, className?: string) {
     var realClassName = className ? className : "default";
 
     var handlerRecord = _registeredHandlers[property.id];
@@ -918,7 +918,7 @@ export function registerNoStylingClass(className) {
     noStylingClasses[className] = 1;
 }
 
-export function getHandler(property: Property, view: View): styling.stylers.StylePropertyChangedHandler {
+export function getHandler(property: Property, view: View): definition.StylePropertyChangedHandler {
     return getHandlerInternal(property.id, types.getClassInfo(view));
 }
 
@@ -1126,5 +1126,50 @@ styleProperty.registerShorthandCallback("font", onFontChanged);
 styleProperty.registerShorthandCallback("margin", onMarginChanged);
 styleProperty.registerShorthandCallback("padding", onPaddingChanged);
 
-// register default stylers once all properties are defined.
-stylers._registerDefaultStylers();
+var _defaultNativeValuesCache = {};
+
+export class StylePropertyChangedHandler {
+    private _applyProperty: (view: View, newValue: any, defaultValue?: any) => void;
+    private _resetProperty: (view: View, nativeValue: any) => void;
+    private _getNativeValue: (view: View) => any;
+
+    constructor(
+        applyCallback: (view: View, newValue: any, defaultValue?: any) => void,
+        resetCallback: (view: View, nativeValue: any) => void,
+        getNativeValue?: (view: View) => any) {
+
+        this._applyProperty = applyCallback;
+        this._resetProperty = resetCallback;
+        this._getNativeValue = getNativeValue;
+    }
+
+    public applyProperty(property: Property, view: View, newValue: any) {
+        var className = types.getClass(view);
+        if (!_defaultNativeValuesCache.hasOwnProperty(className + property.id) && this._getNativeValue) {
+            _defaultNativeValuesCache[className + property.id] = this._getNativeValue(view);
+        }
+
+        if (application.android) {
+            newValue = newValue.android ? newValue.android : newValue;
+        } else if (application.ios) {
+            newValue = newValue.ios ? newValue.ios : newValue;
+        }
+
+        this._applyProperty(view, newValue, _defaultNativeValuesCache[className + property.id]);
+    }
+
+    public resetProperty(property: Property, view: View) {
+        var className = types.getClass(view);
+        this._resetProperty(view, _defaultNativeValuesCache[className + property.id]);
+    }
+}
+
+export var ignorePropertyHandler = new StylePropertyChangedHandler(
+    (view, val) => {
+        // empty
+    },
+    (view, val) => {
+        // empty
+    });
+
+registerNoStylingClass("Frame");

ui/styling/stylers-common.ts

@@ -1,51 +0,0 @@
-import view = require("ui/core/view");
-import dependencyObservable = require("ui/core/dependency-observable");
-import types = require("utils/types");
-
-//late import
-var _appModule = null;
-
-function appModule() {
-    if (!_appModule) {
-        _appModule = require("application");
-    }
-    return _appModule;
-}
-
-var _defaultNativeValuesCache = {};
-
-export class StylePropertyChangedHandler {
-    private _applyProperty: (view: view.View, newValue: any, defaultValue?: any) => void;
-    private _resetProperty: (view: view.View, nativeValue: any) => void;
-    private _getNativeValue: (view: view.View) => any;
-
-    constructor(
-        applyCallback: (view: view.View, newValue: any, defaultValue?: any) => void,
-        resetCallback: (view: view.View, nativeValue: any) => void,
-        getNativeValue?: (view: view.View) => any) {
-
-        this._applyProperty = applyCallback;
-        this._resetProperty = resetCallback;
-        this._getNativeValue = getNativeValue;
-    }
-
-    public applyProperty(property: dependencyObservable.Property, view: view.View, newValue: any) {
-        var className = types.getClass(view);
-        if (!_defaultNativeValuesCache.hasOwnProperty(className + property.id) && this._getNativeValue) {
-            _defaultNativeValuesCache[className + property.id] = this._getNativeValue(view);
-        }
-
-        if (appModule().android) {
-            newValue = newValue.android ? newValue.android : newValue;
-        } else if (appModule().ios) {
-            newValue = newValue.ios ? newValue.ios : newValue;
-        }
-
-        this._applyProperty(view, newValue, _defaultNativeValuesCache[className + property.id]);
-    }
-
-    public resetProperty(property: dependencyObservable.Property, view: view.View) {
-        var className = types.getClass(view);
-        this._resetProperty(view, _defaultNativeValuesCache[className + property.id]);
-    }
-}

ui/styling/stylers.d.ts

@@ -1,3 +0,0 @@
-declare module "ui/styling/stylers" {
-    export function _registerDefaultStylers();
-}

ui/styling/styling.d.ts

@@ -317,42 +317,4 @@
          */
         export var Pressed: string;
     }
-
-    /**
-     * Encapsulates styler classes used for converting NativeScript properties to properties of the native views/widgets.
-     */
-    module stylers {
-        /**
-         * Represents an object that defines how style property should be applied on a native view/widget.
-         */
-        export class StylePropertyChangedHandler {
-            /**
-             * Creates a new StylePropertyChangedHandler object.
-             * @param applyCallback - called when a property value should be applied onto the native view/widget.
-             * @param resetCallback - called when the property value is cleared to restore the native view/widget in its original state. The callback
-             * also receives as a parameter the value stored by the getNativeValue callback.
-             * @param getNativeValue - called when a style property is set for the first time to get the default native value for this property
-             * in the native view/widget. This value will be passed to resetCallback in case the property value is cleared. Optional.
-             */
-            constructor(applyCallback: (view: view.View, newValue: any) => void,
-                resetCallback: (view: view.View, nativeValue: any) => void,
-                getNativeValue?: (view: view.View) => any);
-        }
-
-        /**
-         * Represents a sceleton for an object that holds all style related callbacks and registers handlers.
-         * Used for better code readability.
-         */
-        export class Styler {
-            public static registerHandlers();
-        }
-
-        /**
-         * A function that actually registers a property with a StylePropertyChangedHandler.
-         * @param property - Usually a style dependency property which should be registered for style changes.
-         * @param handler - The handler that reacts on property changes.
-         * @param className(optional) - This parameter (when set) registers handler only for the class with that name and all its inheritors.
-         */
-        export function registerHandler(property: dependencyObservable.Property, handler: StylePropertyChangedHandler, className?: string);
-    }
 }

ui/styling/styling.ts

@@ -1,6 +1,5 @@
 import styleModule = require("./style");
 import stylePropertyModule = require("./style-property");
-import stylersCommonModule = require("./stylers-common");
 import visualStateConstatnsModule = require("./visual-state-constants");
 import convertersModule = require("./converters");
 
@@ -37,9 +36,4 @@ export module visualStates {
     export var Normal = visualStateConstatnsModule.Normal;
     export var Hovered = visualStateConstatnsModule.Hovered;
     export var Pressed = visualStateConstatnsModule.Pressed; 
-};
-
-export module stylers {
-    export var StylePropertyChangedHandler = stylersCommonModule.StylePropertyChangedHandler;
-    export var registerHandler = styleModule.registerHandler;
-}
+};