Merge pull request #358 from NativeScript/hhristov/native-layouts

Style class batch changes before updating native instance.

ui/styling/style-scope.ts

@@ -123,6 +123,7 @@ export class StyleScope {
             return;
         }
 
+        view.style._beginUpdate();
         var i,
             selector: cssSelector.CssSelector,
             matchedStateSelectors = new Array<cssSelector.CssVisualStateSelector>()
@@ -153,6 +154,8 @@ export class StyleScope {
                 this._createVisualsStatesForSelectors(key, matchedStateSelectors);
             }
         }
+
+        view.style._endUpdate();
     }
 
     public getVisualStates(view: view.View): Object {

ui/styling/style.ts

@@ -23,6 +23,8 @@ var noStylingClasses = {};
 
 export class Style extends observable.DependencyObservable implements styling.Style {
     private _view: view.View;
+    private _inUpdate = false;
+    private _nativeSetters = new Map<dependencyObservable.Property, any>();
 
     get color(): color.Color {
         return this._getValue(colorProperty);
@@ -211,6 +213,16 @@ export class Style extends observable.DependencyObservable implements styling.St
         this._view = parentView;
     }
     
+    public _beginUpdate() {
+        this._inUpdate = true;
+    }
+
+    public _endUpdate() {
+        this._inUpdate = false;
+        this._nativeSetters.forEach((newValue, property, map) => { this._applyStyleProperty(property, newValue); });
+        this._nativeSetters.clear();
+    }
+
     public _resetCssValues() {
         var that = this;
         this._eachSetProperty(function (property: observable.Property) {
@@ -263,6 +275,11 @@ export class Style extends observable.DependencyObservable implements styling.St
     }
 
     private _applyStyleProperty(property: dependencyObservable.Property, newValue: any) {
+        if (this._inUpdate) {
+            this._nativeSetters.set(property, newValue);
+            return;
+        }
+
         try {
             var handler: styling.stylers.StylePropertyChangedHandler = getHandler(property, this._view);
 

ui/styling/styling.d.ts

@@ -149,6 +149,8 @@
         opacity: number;
 
         //@private
+        public _beginUpdate();
+        public _endUpdate();
         public _resetCssValues(): void;
         public _syncNativeProperties(): void;
         public _inheritStyleProperty(property: dependencyObservable.Property): void;