Merge pull request #3977 from NativeScript/fix-initial-animations

Inital animations were not played in android

tns-core-modules/ui/core/view-base/view-base.ts

@@ -608,13 +608,19 @@ export abstract class ViewBase extends Observable implements ViewBaseDefinition
     }
 
     public initNativeView(): void {
-        //
+        // No initNativeView(this)?
+        if (this._cssState) {
+            this._cssState.playPendingKeyframeAnimations();
+        }
     }
 
     public resetNativeView(): void {
         if (this.nativeView && this.recycleNativeView && isAndroid) {
             resetNativeView(this);
         }
+        if (this._cssState) {
+            this._cancelAllAnimations();
+        }
     }
 
     public _setupUI(context: android.content.Context, atIndex?: number, parentIsLoaded?: boolean) {

tns-core-modules/ui/styling/style-scope.ts

@@ -86,6 +86,8 @@ if (application.hasLaunched()) {
 }
 
 export class CssState {
+    private _pendingKeyframeAnimations: SelectorCore[];
+
     constructor(private view: ViewBase, private match: SelectorsMatch<ViewBase>) {
     }
 
@@ -103,7 +105,15 @@ export class CssState {
         }
 
         matchingSelectors.forEach(s => this.applyDescriptors(s.ruleset));
-        matchingSelectors.forEach(s => this.playKeyframeAnimations(s.ruleset));
+        this._pendingKeyframeAnimations = matchingSelectors;
+        this.playPendingKeyframeAnimations();
+    }
+
+    public playPendingKeyframeAnimations() {
+        if (this._pendingKeyframeAnimations && this.view.nativeView) {
+            this._pendingKeyframeAnimations.forEach(s => this.playKeyframeAnimationsFromRuleSet(s.ruleset));
+            this._pendingKeyframeAnimations = null;
+        }
     }
 
     private applyDescriptors(ruleset: RuleSet): void {
@@ -123,7 +133,7 @@ export class CssState {
         });
     }
 
-    private playKeyframeAnimations(ruleset: RuleSet): void {
+    private playKeyframeAnimationsFromRuleSet(ruleset: RuleSet): void {
         let ruleAnimations: kam.KeyframeAnimationInfo[] = ruleset[animationsSymbol];
         if (ruleAnimations) {
             ensureKeyframeAnimationModule();