From 7c689530093c5bb4e991b7743b9751162ae5dc65 Mon Sep 17 00:00:00 2001
From: Hristo Hristov <hristo.hristov@telerik.com>
Date: Fri, 20 Oct 2017 08:37:36 +0300
Subject: [PATCH] Fix clear history transition (#4951)

* fix: Navigation test app added

* Removed native popToBackstack call.
Implemented custom fragment save/restore state.
When navigating back we reverse manually transitions/animations because we no longer add them to navite backstack.
Fragment instance stored on entry.
Animation and Transition listeners now holds reference to entry instead of fragment for easier update of fragment.
Animation and Transition listeners removed when entry removed from backstack.
Animation and Transition removed from fragment when fragment activity is destroyed.

* Revert package.json start up entry
Fixed bug where goBack took the last element in backstack while navigationQueue is not empty.
Fixed bug where goBack to specific entry in the backstack was removing that entry...
Removed duplicated method
Refactored method name
Fixed TS
---
 apps/app/navigation-app/app.css               |  13 +
 apps/app/navigation-app/app.ts                |  12 +
 apps/app/navigation-app/main-page.ts          |  69 +++
 apps/app/navigation-app/main-page.xml         |  13 +
 tests/app/ui/helper.ts                        |  16 +-
 tests/app/ui/scroll-view/scroll-view-tests.ts |  27 +-
 tns-core-modules/ui/frame/fragment.android.ts |   9 +-
 .../ui/frame/fragment.transitions.android.ts  | 473 +++++++++---------
 .../ui/frame/fragment.transitions.d.ts        |  38 +-
 tns-core-modules/ui/frame/frame-common.ts     |  47 +-
 tns-core-modules/ui/frame/frame.android.ts    | 181 ++++---
 tns-core-modules/ui/frame/frame.d.ts          |  16 +
 tns-core-modules/ui/frame/frame.ios.ts        |   3 +-
 13 files changed, 557 insertions(+), 360 deletions(-)
 create mode 100644 apps/app/navigation-app/app.css
 create mode 100644 apps/app/navigation-app/app.ts
 create mode 100644 apps/app/navigation-app/main-page.ts
 create mode 100644 apps/app/navigation-app/main-page.xml

diff --git a/apps/app/navigation-app/app.css b/apps/app/navigation-app/app.css
new file mode 100644
index 000000000..6836901c4
--- /dev/null
+++ b/apps/app/navigation-app/app.css
@@ -0,0 +1,13 @@
+.btn1 {
+    background-color: lightgreen;
+    color: coral;
+    font-size: 20;
+    font-family: monospace;
+}
+
+.btn2 {
+    background-color: coral;
+    color: lightgreen;
+    font-size: 24;
+    font-family: serif;
+}
\ No newline at end of file
diff --git a/apps/app/navigation-app/app.ts b/apps/app/navigation-app/app.ts
new file mode 100644
index 000000000..677bdc781
--- /dev/null
+++ b/apps/app/navigation-app/app.ts
@@ -0,0 +1,12 @@
+import * as application from "tns-core-modules/application";
+import * as trace from "tns-core-modules/trace";
+trace.addCategories(
+    trace.categories.Transition)
+// + "," + 
+//     trace.categories.NativeLifecycle + "," + 
+//     trace.categories.Navigation);
+trace.enable();
+
+// Needed only for build infrastructure
+application.setCssFileName("navigation-app/app.css");
+application.start({ moduleName: "navigation-app/main-page" });
\ No newline at end of file
diff --git a/apps/app/navigation-app/main-page.ts b/apps/app/navigation-app/main-page.ts
new file mode 100644
index 000000000..5f952ca9f
--- /dev/null
+++ b/apps/app/navigation-app/main-page.ts
@@ -0,0 +1,69 @@
+import { EventData } from 'tns-core-modules/data/observable';
+import { Page, NavigatedData } from 'tns-core-modules/ui/page';
+import { topmost, NavigationEntry } from 'tns-core-modules/ui/frame';
+
+export function nav() {
+    const e: NavigationEntry = {
+        moduleName: "navigation-app/main-page"
+    }
+    topmost().navigate(e)
+}
+export function navClearTrans() {
+    console.log("transition and clear")
+
+    const e: NavigationEntry = {
+        transition: {
+            name: "slideLeft",
+            curve: "linear"
+        },
+        clearHistory: true,
+        moduleName: "navigation-app/main-page"
+    }
+    topmost().navigate(e)
+}
+
+export function navWithTransition() {
+    const e: NavigationEntry = {
+        transition: {
+            name: "slideLeft",
+            curve: "linear"
+        },
+        moduleName: "navigation-app/main-page"
+    }
+    topmost().navigate(e)
+}
+
+export function navWithClear() {
+    const e: NavigationEntry = {
+        clearHistory: true,
+        moduleName: "navigation-app/main-page"
+    }
+    topmost().navigate(e)
+}
+
+let i = 0;
+const colors = ["lightgreen", "lightblue", "lightcoral"]
+
+export function navigatedFrom(args: NavigatedData) {
+    console.log(`navigatedFrom ${args.object.toString()}  isBack: ${args.isBackNavigation}`)
+}
+
+export function navigatedTo(args: NavigatedData) {
+    console.log(`navigatedTo ${args.object.toString()}  isBack: ${args.isBackNavigation}`)
+}
+
+export function navigatingTo(args: NavigatedData) {
+    if (!args.isBackNavigation) {
+        (<any>args.object).page.backgroundColor = colors[(i++) % 3];
+        const array = new Array();
+        for (let i = 0; i < 50; i++) {
+            array[i] = i;
+        }
+        (<any>args.object).page.bindingContext = array;
+    }
+    console.log(`navigatingTo ${args.object.toString()}  isBack: ${args.isBackNavigation}`)
+}
+
+export function navigatingFrom(args: NavigatedData) {
+    console.log(`navigatingFrom ${args.object.toString()}  isBack: ${args.isBackNavigation}`)
+}
\ No newline at end of file
diff --git a/apps/app/navigation-app/main-page.xml b/apps/app/navigation-app/main-page.xml
new file mode 100644
index 000000000..cf7d2a0d8
--- /dev/null
+++ b/apps/app/navigation-app/main-page.xml
@@ -0,0 +1,13 @@
+<Page xmlns="http://schemas.nativescript.org/tns.xsd" 
+    navigatingTo="navigatingTo" 
+    navigatingFrom="navigatingFrom" 
+    navigatedTo="navigatedTo" 
+    navigatedFrom="navigatedFrom">
+    <StackLayout>
+        <Button text="Nav" tap="nav" />
+        <Button text="Clear history Trans" tap="navClearTrans" />
+        <Button text="Nav Transition" tap="navWithTransition" />
+        <Button text="Nav Clear" tap="navWithClear" />
+        <ListView items="{{ $value }}" />
+    </StackLayout>
+</Page>
\ No newline at end of file
diff --git a/tests/app/ui/helper.ts b/tests/app/ui/helper.ts
index 3446a96da..23e0f5639 100644
--- a/tests/app/ui/helper.ts
+++ b/tests/app/ui/helper.ts
@@ -152,14 +152,16 @@ export function getClearCurrentPage(): Page {
     return page;
 }
 
-export function waitUntilNavigatedFrom(oldPage: Page) {
+export function waitUntilNavigatedFrom(action: Function) {
+    const currentPage = frame.topmost().currentPage;
     let completed = false;
     function navigatedFrom(args) {
         args.object.page.off("navigatedFrom", navigatedFrom);
         completed = true;
     }
 
-    oldPage.on("navigatedFrom", navigatedFrom);
+    currentPage.on("navigatedFrom", navigatedFrom);
+    action();
     TKUnit.waitUntilReady(() => completed);
 }
 
@@ -168,22 +170,18 @@ export function waitUntilLayoutReady(view: View): void {
 }
 
 export function navigateWithEntry(entry: frame.NavigationEntry): Page {
-    let page = frame.resolvePageFromEntry(entry);
+    const page = frame.resolvePageFromEntry(entry);
     entry.moduleName = null;
     entry.create = function () {
         return page;
     };
 
-    let currentPage = getCurrentPage();
-    frame.topmost().navigate(entry);
-    waitUntilNavigatedFrom(currentPage);
+    waitUntilNavigatedFrom(() => frame.topmost().navigate(entry));
     return page;
 }
 
 export function goBack() {
-    let currentPage = getCurrentPage();
-    frame.topmost().goBack();
-    waitUntilNavigatedFrom(currentPage);
+    waitUntilNavigatedFrom(() => frame.topmost().goBack());
 }
 
 export function assertAreClose(actual: number, expected: number, message: string): void {
diff --git a/tests/app/ui/scroll-view/scroll-view-tests.ts b/tests/app/ui/scroll-view/scroll-view-tests.ts
index 55ac758f3..5cf2b16c6 100644
--- a/tests/app/ui/scroll-view/scroll-view-tests.ts
+++ b/tests/app/ui/scroll-view/scroll-view-tests.ts
@@ -5,6 +5,7 @@ import * as testModule from "../../ui-test";
 import * as layoutHelper from "../layouts/layout-helper";
 import { Page } from "tns-core-modules/ui/page";
 import * as frame from "tns-core-modules/ui/frame";
+import * as helper from "../helper";
 
 // >> article-require-scrollview-module
 import * as scrollViewModule from "tns-core-modules/ui/scroll-view";
@@ -154,15 +155,8 @@ class ScrollLayoutTest extends testModule.UITest<scrollViewModule.ScrollView> {
         this.testView.scrollToVerticalOffset(layoutHelper.dp(100), false);
         TKUnit.assertAreClose(layoutHelper.dip(this.testView.verticalOffset), 100, 0.1, "this.testView.verticalOffset before navigation");
 
-        let page = new Page();
-        let createFunc = () => {
-            return page;
-        };
-
-        let entry: frame.NavigationEntry = { create: createFunc, animated: false };
-        frame.topmost().navigate(entry);
-        TKUnit.waitUntilReady(() => page.isLayoutValid);
-        frame.topmost().goBack();
+        helper.navigateWithHistory(() => new Page());
+        helper.goBack();
 
         // Wait for the page to reload.
         TKUnit.waitUntilReady(() => { return TKUnit.areClose(layoutHelper.dip(this.testView.verticalOffset), 100, 0.1); });
@@ -178,19 +172,8 @@ class ScrollLayoutTest extends testModule.UITest<scrollViewModule.ScrollView> {
         this.testView.scrollToHorizontalOffset(layoutHelper.dp(100), false);
 
         TKUnit.assertAreClose(layoutHelper.dip(this.testView.horizontalOffset), 100, 0.1, "this.testView.horizontalOffset before navigation");
-
-        let page = new Page();
-        let createFunc = () => {
-            return page;
-        };
-
-        let entry: frame.NavigationEntry = { create: createFunc, animated: false };
-        frame.topmost().navigate(entry);
-        TKUnit.waitUntilReady(() => page.isLayoutValid);
-        frame.topmost().goBack();
-
-        // Wait for the page to reload.
-        TKUnit.waitUntilReady(() => { return TKUnit.areClose(layoutHelper.dip(this.testView.horizontalOffset), 100, 0.1); });
+        helper.navigateWithHistory(() => new Page());
+        helper.goBack();
 
         // Check verticalOffset after navigation
         TKUnit.assertAreClose(layoutHelper.dip(this.testView.horizontalOffset), 100, 0.1, "this.testView.horizontalOffset after navigation");
diff --git a/tns-core-modules/ui/frame/fragment.android.ts b/tns-core-modules/ui/frame/fragment.android.ts
index c59d7c6cd..53826e785 100644
--- a/tns-core-modules/ui/frame/fragment.android.ts
+++ b/tns-core-modules/ui/frame/fragment.android.ts
@@ -46,8 +46,13 @@ class FragmentClass extends android.app.Fragment {
     }
 
     public toString(): string {
-        return this._callbacks.toStringOverride(this, super.toString);
+        const callbacks = this._callbacks;
+        if (callbacks) {
+            return callbacks.toStringOverride(this, super.toString);
+        } else {
+            super.toString();
+        }
     }
 }
 
-setFragmentClass(FragmentClass);
+setFragmentClass(FragmentClass);
\ No newline at end of file
diff --git a/tns-core-modules/ui/frame/fragment.transitions.android.ts b/tns-core-modules/ui/frame/fragment.transitions.android.ts
index 636f6b9da..2d6221844 100644
--- a/tns-core-modules/ui/frame/fragment.transitions.android.ts
+++ b/tns-core-modules/ui/frame/fragment.transitions.android.ts
@@ -1,5 +1,6 @@
 // Definitions.
 import { NavigationTransition, BackstackEntry, Frame } from "../frame";
+import { AnimationType } from "./fragment.transitions";
 
 // Types.
 import { Transition, AndroidTransitionType } from "../transition/transition";
@@ -19,15 +20,10 @@ const sdkVersion = lazy(() => parseInt(device.sdkVersion));
 const intEvaluator = lazy(() => new android.animation.IntEvaluator());
 const defaultInterpolator = lazy(() => new android.view.animation.AccelerateDecelerateInterpolator());
 
-const enterFakeResourceId = -10;
-const exitFakeResourceId = -20;
-const popEnterFakeResourceId = -30;
-const popExitFakeResourceId = -40;
-
 const waitingQueue = new Set<android.app.Fragment>();
 
 interface TransitionListener {
-    new(fragment: android.app.Fragment): ExpandedTransitionListener;
+    new(entry: ExpandedEntry, transition: android.transition.Transition): ExpandedTransitionListener;
 }
 
 let TransitionListener: TransitionListener;
@@ -39,16 +35,13 @@ let defaultExitAnimatorStatic: android.animation.Animator;
 let fragmentCompleted: android.app.Fragment;
 
 interface ExpandedAnimator extends android.animation.Animator {
+    entry: ExpandedEntry;
     transitionType?: string;
-    fragment?: android.app.Fragment;
 }
 
 interface ExpandedTransitionListener extends android.transition.Transition.TransitionListener {
-    fragment: android.app.Fragment;
-    enterTransition: android.transition.Transition;
-    exitTransition: android.transition.Transition;
-    reenterTransition: android.transition.Transition;
-    returnTransition: android.transition.Transition;
+    entry: ExpandedEntry;
+    transition: android.transition.Transition;
 }
 
 interface ExpandedEntry extends BackstackEntry {
@@ -71,79 +64,6 @@ interface FragmentCallbacks {
     entry: ExpandedEntry;
 }
 
-function getFragmentCallbacks(fragment: android.app.Fragment): FragmentCallbacks {
-    return fragment[CALLBACKS] as FragmentCallbacks;
-}
-
-export function _updateAnimationFragment(newFragment: android.app.Fragment): void {
-    const callbacks = getFragmentCallbacks(newFragment);
-    const entry = callbacks.entry;
-    // oldFragment should be a fragment that we hold reference to but it
-    // is no longer used in the activity because activity was recreated.
-    // We take the oldFragment from any of the animators or transitions.
-    // It should be the same and we must have an oldFragment.
-    const animator = entry.enterAnimator || entry.exitAnimator || entry.popEnterAnimator || entry.popExitAnimator;
-    const transitionListener = entry.enterTransitionListener || entry.exitTransitionListener || entry.reenterTransitionListener || entry.returnTransitionListener;
-
-    const oldFragmentOwner = animator || transitionListener;
-    const oldFragment = oldFragmentOwner ? oldFragmentOwner.fragment : null;
-
-    updateAnimatorTarget(entry.enterAnimator, newFragment);
-    updateAnimatorTarget(entry.exitAnimator, newFragment);
-    updateAnimatorTarget(entry.popEnterAnimator, newFragment);
-    updateAnimatorTarget(entry.popExitAnimator, newFragment);
-
-    clearAllTransitions(oldFragment);
-
-    const enterTransitionListener = entry.enterTransitionListener;
-    if (enterTransitionListener) {
-        enterTransitionListener.fragment = newFragment;
-        newFragment.setEnterTransition(enterTransitionListener.enterTransition);
-    }
-
-    const exitTransitionListener = entry.exitTransitionListener;
-    if (exitTransitionListener) {
-        exitTransitionListener.fragment = newFragment;
-        newFragment.setExitTransition(exitTransitionListener.exitTransition);
-    }
-
-    const reenterTransitionListener = entry.reenterTransitionListener;
-    if (reenterTransitionListener) {
-        reenterTransitionListener.fragment = newFragment;
-        newFragment.setReenterTransition(reenterTransitionListener.reenterTransition);
-    }
-
-    const returnTransitionListener = entry.returnTransitionListener;
-    if (returnTransitionListener) {
-        returnTransitionListener.fragment = newFragment;
-        newFragment.setReturnTransition(returnTransitionListener.returnTransition);
-    }
-}
-
-function updateAnimatorTarget(animator: ExpandedAnimator, fragment: android.app.Fragment): void {
-    if (animator) {
-        animator.fragment = fragment;
-    }
-}
-
-export function _waitForAnimationEnd(newFragment, currentFragment): void {
-    if (waitingQueue.size > 0) {
-        throw new Error('Calling navigation before previous queue completes.');
-    }
-
-    if (newFragment) {
-        waitingQueue.add(newFragment);
-    }
-
-    if (currentFragment) {
-        waitingQueue.add(currentFragment);
-    }
-
-    if (waitingQueue.size === 0) {
-        throw new Error('At least one fragment should be specified.');
-    }
-}
-
 export function _setAndroidFragmentTransitions(
     animated: boolean,
     navigationTransition: NavigationTransition,
@@ -152,7 +72,9 @@ export function _setAndroidFragmentTransitions(
     fragmentTransaction: android.app.FragmentTransaction,
     manager: android.app.FragmentManager): void {
 
-    _waitForAnimationEnd(newFragment, currentFragment);
+    if (waitingQueue.size > 0) {
+        throw new Error('Calling navigation before previous queue completes.');
+    }
 
     if (sdkVersion() >= 21) {
         allowTransitionOverlap(currentFragment);
@@ -183,16 +105,19 @@ export function _setAndroidFragmentTransitions(
     const newEntry = callbacks.entry;
     const currentEntry = currentFragment ? getFragmentCallbacks(currentFragment).entry : null;
     let currentFragmentNeedsDifferentAnimation = false;
-    if (currentEntry &&
-        (currentEntry.transitionName !== name || currentEntry.transition !== transition)) {
-        clearTransitions(currentFragment, true);
-        currentFragmentNeedsDifferentAnimation = true;
+    if (currentEntry) {
+        _updateTransitions(currentEntry);
+        if (currentEntry.transitionName !== name
+            || currentEntry.transition !== transition) {
+            clearExitAndReenterTransitions(currentEntry, true);
+            currentFragmentNeedsDifferentAnimation = true;
+        }
     }
 
     if (name === 'none') {
         transition = new NoTransition(0, null);
     } else if (name === 'default') {
-        initDefaultAnimations(manager)
+        initDefaultAnimations(manager);
         transition = new DefaultTransition(0, null);
     } else if (useLollipopTransition) {
         // setEnterTransition: Enter
@@ -201,19 +126,19 @@ export function _setAndroidFragmentTransitions(
         // setReturnTransition: Pop Exit, same as Enter if not specified
 
         if (name.indexOf('slide') === 0) {
-            setupNewFragmentSlideTransition(navigationTransition, newFragment, name);
+            setupNewFragmentSlideTransition(navigationTransition, newEntry, name);
             if (currentFragmentNeedsDifferentAnimation) {
-                setupCurrentFragmentSlideTransition(navigationTransition, currentFragment, name);
+                setupCurrentFragmentSlideTransition(navigationTransition, currentEntry, name);
             }
         } else if (name === 'fade') {
-            setupNewFragmentFadeTransition(navigationTransition, newFragment);
+            setupNewFragmentFadeTransition(navigationTransition, newEntry);
             if (currentFragmentNeedsDifferentAnimation) {
-                setupCurrentFragmentFadeTransition(navigationTransition, currentFragment);
+                setupCurrentFragmentFadeTransition(navigationTransition, currentEntry);
             }
         } else if (name === 'explode') {
-            setupNewFragmentExplodeTransition(navigationTransition, newFragment);
+            setupNewFragmentExplodeTransition(navigationTransition, newEntry);
             if (currentFragmentNeedsDifferentAnimation) {
-                setupCurrentFragmentExplodeTransition(navigationTransition, currentFragment);
+                setupCurrentFragmentExplodeTransition(navigationTransition, currentEntry);
             }
         }
     } else if (name.indexOf('slide') === 0) {
@@ -233,10 +158,10 @@ export function _setAndroidFragmentTransitions(
 
     // Having transition means we have custom animation
     if (transition) {
-        fragmentTransaction.setCustomAnimations(enterFakeResourceId, exitFakeResourceId, popEnterFakeResourceId, popExitFakeResourceId);
-        setupAllAnimation(newFragment, transition);
+        fragmentTransaction.setCustomAnimations(AnimationType.enterFakeResourceId, AnimationType.exitFakeResourceId, AnimationType.popEnterFakeResourceId, AnimationType.popExitFakeResourceId);
+        setupAllAnimation(newEntry, transition);
         if (currentFragmentNeedsDifferentAnimation) {
-            setupExitAndPopEnterAnimation(currentFragment, transition);
+            setupExitAndPopEnterAnimation(currentEntry, transition);
         }
     }
 
@@ -247,100 +172,133 @@ export function _setAndroidFragmentTransitions(
         }
     }
 
-    printTransitions(currentFragment);
-    printTransitions(newFragment);
+    printTransitions(currentEntry);
+    printTransitions(newEntry);
 }
 
 export function _onFragmentCreateAnimator(fragment: android.app.Fragment, nextAnim: number): android.animation.Animator {
     const entry = getFragmentCallbacks(fragment).entry;
     switch (nextAnim) {
-        case enterFakeResourceId:
+        case AnimationType.enterFakeResourceId:
             return entry.enterAnimator;
-        case exitFakeResourceId:
+        case AnimationType.exitFakeResourceId:
             return entry.exitAnimator;
-        case popEnterFakeResourceId:
+        case AnimationType.popEnterFakeResourceId:
             return entry.popEnterAnimator;
-        case popExitFakeResourceId:
+        case AnimationType.popExitFakeResourceId:
             return entry.popExitAnimator;
     }
 
     return null;
 }
 
-class NoTransition extends Transition {
-    public createAndroidAnimator(transitionType: string): android.animation.Animator {
-        return createDummyZeroDurationAnimator();
+export function _updateTransitions(entry: ExpandedEntry): void {
+    const fragment = entry.fragment;
+    const enterTransitionListener = entry.enterTransitionListener;
+    if (enterTransitionListener) {
+        fragment.setEnterTransition(enterTransitionListener.transition);
+    }
+
+    const exitTransitionListener = entry.exitTransitionListener;
+    if (exitTransitionListener) {
+        fragment.setExitTransition(exitTransitionListener.transition);
+    }
+
+    const reenterTransitionListener = entry.reenterTransitionListener;
+    if (reenterTransitionListener) {
+        fragment.setReenterTransition(reenterTransitionListener.transition);
+    }
+
+    const returnTransitionListener = entry.returnTransitionListener;
+    if (returnTransitionListener) {
+        fragment.setReturnTransition(returnTransitionListener.transition);
     }
 }
 
-class DefaultTransition extends Transition {
-    public createAndroidAnimator(transitionType: string): android.animation.Animator {
-        switch (transitionType) {
-            case AndroidTransitionType.enter:
-            case AndroidTransitionType.popEnter:
-                return getDefaultAnimation(true);
-
-            case AndroidTransitionType.popExit:
-            case AndroidTransitionType.exit:
-                return getDefaultAnimation(false);
+export function _reverseTransitions(previousEntry: ExpandedEntry, currentEntry: ExpandedEntry): boolean {
+    const previousFragment = previousEntry.fragment;
+    const currentFragment = currentEntry.fragment;
+    let transitionUsed = false;
+    if (sdkVersion() >= 21) {
+        const returnTransitionListener = currentEntry.returnTransitionListener;
+        if (returnTransitionListener) {
+            transitionUsed = true;
+            currentFragment.setExitTransition(returnTransitionListener.transition);
+        } else {
+            currentFragment.setExitTransition(null);
         }
+
+        const reenterTransitionListener = previousEntry.reenterTransitionListener;
+        if (reenterTransitionListener) {
+            transitionUsed = true;
+            previousFragment.setEnterTransition(reenterTransitionListener.transition);
+        } else {
+            previousFragment.setEnterTransition(null);
+        }
+
     }
+
+    return transitionUsed;
+}
+
+function getFragmentCallbacks(fragment: android.app.Fragment): FragmentCallbacks {
+    return fragment[CALLBACKS] as FragmentCallbacks;
 }
 
 // Transition listener can't be static because
 // android is cloning transitions and we can't expand them :(
-function getTransitionListener(fragment: android.app.Fragment): ExpandedTransitionListener {
+function getTransitionListener(entry: ExpandedEntry, transition: android.transition.Transition): ExpandedTransitionListener {
     if (!TransitionListener) {
         @Interfaces([(<any>android).transition.Transition.TransitionListener])
         class TransitionListenerImpl extends java.lang.Object implements android.transition.Transition.TransitionListener {
-            constructor(public fragment: android.app.Fragment) {
+            constructor(public entry: ExpandedEntry, public transition: android.transition.Transition) {
                 super();
                 return global.__native(this);
             }
 
             public onTransitionStart(transition: android.transition.Transition): void {
+                const fragment = this.entry.fragment;
+                waitingQueue.add(fragment);
                 if (traceEnabled()) {
-                    traceWrite(`START ${toShortString(transition)} transition for ${this.fragment}`, traceCategories.Transition);
+                    traceWrite(`START ${toShortString(transition)} transition for ${fragment}`, traceCategories.Transition);
                 }
             }
 
             onTransitionEnd(transition: android.transition.Transition): void {
-                const expandedFragment = this.fragment;
+                const fragment = this.entry.fragment;
                 if (traceEnabled()) {
-                    traceWrite(`END ${toShortString(transition)} transition for ${expandedFragment}`, traceCategories.Transition);
+                    traceWrite(`END ${toShortString(transition)} transition for ${fragment}`, traceCategories.Transition);
                 }
 
-                transitionOrAnimationCompleted(expandedFragment);
+                transitionOrAnimationCompleted(fragment);
             }
 
             onTransitionResume(transition: android.transition.Transition): void {
                 if (traceEnabled()) {
-                    traceWrite(`RESUME ${toShortString(transition)} transition for ${this.fragment}`, traceCategories.Transition);
+                    const fragment = this.entry.fragment;
+                    traceWrite(`RESUME ${toShortString(transition)} transition for ${fragment}`, traceCategories.Transition);
                 }
             }
 
             onTransitionPause(transition: android.transition.Transition): void {
                 if (traceEnabled()) {
-                    traceWrite(`PAUSE ${toShortString(transition)} transition for ${this.fragment}`, traceCategories.Transition);
+                    const fragment = this.entry.fragment;
+                    traceWrite(`PAUSE ${toShortString(transition)} transition for ${fragment}`, traceCategories.Transition);
                 }
             }
 
             onTransitionCancel(transition: android.transition.Transition): void {
                 if (traceEnabled()) {
-                    traceWrite(`CANCEL ${toShortString(transition)} transition for ${this.fragment}`, traceCategories.Transition);
+                    const fragment = this.entry.fragment;
+                    traceWrite(`CANCEL ${toShortString(transition)} transition for ${fragment}`, traceCategories.Transition);
                 }
             }
-
-            enterTransition: android.transition.Transition;
-            exitTransition: android.transition.Transition;
-            reenterTransition: android.transition.Transition;
-            returnTransition: android.transition.Transition;
         }
 
         TransitionListener = TransitionListenerImpl;
     }
 
-    return new TransitionListener(fragment);
+    return new TransitionListener(entry, transition);
 }
 
 function getAnimationListener(): android.animation.Animator.IAnimatorListener {
@@ -353,28 +311,30 @@ function getAnimationListener(): android.animation.Animator.IAnimatorListener {
             }
 
             onAnimationStart(animator: ExpandedAnimator): void {
+                const fragment = animator.entry.fragment;
+                waitingQueue.add(fragment);
                 if (traceEnabled()) {
-                    traceWrite(`START ${animator.transitionType} for ${animator.fragment}`, traceCategories.Transition);
+                    traceWrite(`START ${animator.transitionType} for ${fragment}`, traceCategories.Transition);
                 }
             }
 
             onAnimationRepeat(animator: ExpandedAnimator): void {
                 if (traceEnabled()) {
-                    traceWrite(`REPEAT ${animator.transitionType} for ${animator.fragment}`, traceCategories.Transition);
+                    traceWrite(`REPEAT ${animator.transitionType} for ${animator.entry.fragment}`, traceCategories.Transition);
                 }
             }
 
             onAnimationEnd(animator: ExpandedAnimator): void {
                 if (traceEnabled()) {
-                    traceWrite(`END ${animator.transitionType} for ${animator.fragment}`, traceCategories.Transition);
+                    traceWrite(`END ${animator.transitionType} for ${animator.entry.fragment}`, traceCategories.Transition);
                 }
 
-                transitionOrAnimationCompleted(animator.fragment);
+                transitionOrAnimationCompleted(animator.entry.fragment);
             }
 
             onAnimationCancel(animator: ExpandedAnimator): void {
                 if (traceEnabled()) {
-                    traceWrite(`CANCEL ${animator.transitionType} for ${animator.fragment}`, traceCategories.Transition);
+                    traceWrite(`CANCEL ${animator.transitionType} for ${animator.entry.fragment}`, traceCategories.Transition);
                 }
             }
         }
@@ -392,21 +352,18 @@ function clearAnimationListener(animator: ExpandedAnimator, listener: android.an
 
     animator.removeListener(listener);
 
-    const fragment = animator.fragment;
-    if (!fragment) {
-        return;
-    }
-
-    animator.fragment = null;
-    const entry = getFragmentCallbacks(fragment).entry;
+    const entry = animator.entry;
+    const fragment = entry.fragment;
     if (traceEnabled()) {
         traceWrite(`Clear ${animator.transitionType} - ${entry.transition} for ${fragment}`, traceCategories.Transition);
     }
+
+    animator.entry = null;
 }
 
-function clearTransitions(fragment: android.app.Fragment, removeListener: boolean): void {
+function clearExitAndReenterTransitions(entry: ExpandedEntry, removeListener: boolean): void {
     if (sdkVersion() >= 21) {
-        const entry = getFragmentCallbacks(fragment).entry;
+        const fragment: android.app.Fragment = entry.fragment;
         const exitListener = entry.exitTransitionListener;
         if (exitListener) {
             const exitTransition = fragment.getExitTransition();
@@ -415,7 +372,7 @@ function clearTransitions(fragment: android.app.Fragment, removeListener: boolea
                     exitTransition.removeListener(exitListener);
                 }
 
-                fragment.setExitTransition(null);//exit
+                fragment.setExitTransition(null);
                 if (traceEnabled()) {
                     traceWrite(`Cleared Exit ${exitTransition.getClass().getSimpleName()} transition for ${fragment}`, traceCategories.Transition);
                 }
@@ -434,7 +391,7 @@ function clearTransitions(fragment: android.app.Fragment, removeListener: boolea
                     reenterTransition.removeListener(reenterListener);
                 }
 
-                fragment.setReenterTransition(null);//popEnter
+                fragment.setReenterTransition(null);
                 if (traceEnabled()) {
                     traceWrite(`Cleared Reenter ${reenterTransition.getClass().getSimpleName()} transition for ${fragment}`, traceCategories.Transition);
                 }
@@ -446,38 +403,65 @@ function clearTransitions(fragment: android.app.Fragment, removeListener: boolea
         }
     }
 }
+export function _clearFragment(fragment: android.app.Fragment): void {
+    clearEntry(getFragmentCallbacks(fragment).entry, false);
+}
 
-function clearAllTransitions(fragment: android.app.Fragment): void {
-    if (!fragment) {
-        return;
-    }
+export function _clearEntry(entry: ExpandedEntry): void {
+    clearEntry(entry, true);
+}
 
-    clearTransitions(fragment, false);
+function clearEntry(entry: ExpandedEntry, removeListener: boolean): void {
+    clearExitAndReenterTransitions(entry, removeListener);
 
     if (sdkVersion() >= 21) {
-        const entry = getFragmentCallbacks(fragment).entry;
+        const fragment: android.app.Fragment = entry.fragment;
         const enterListener = entry.enterTransitionListener;
         if (enterListener) {
             const enterTransition = fragment.getEnterTransition();
             if (enterTransition) {
-                fragment.setEnterTransition(null);//exit
+                if (removeListener) {
+                    enterTransition.removeListener(enterListener);
+                }
+
+                fragment.setEnterTransition(null);
                 if (traceEnabled()) {
                     traceWrite(`Cleared Enter ${enterTransition.getClass().getSimpleName()} transition for ${fragment}`, traceCategories.Transition);
                 }
             }
+
+            if (removeListener) {
+                entry.enterTransitionListener = null;
+            }
         }
 
         const returnListener = entry.returnTransitionListener;
         if (returnListener) {
             const returnTransition = fragment.getReturnTransition();
             if (returnTransition) {
-                fragment.setReturnTransition(null);//popEnter
+                if (removeListener) {
+                    returnTransition.removeListener(returnListener);
+                }
+
+                fragment.setReturnTransition(null);
                 if (traceEnabled()) {
                     traceWrite(`Cleared Return ${returnTransition.getClass().getSimpleName()} transition for ${fragment}`, traceCategories.Transition);
                 }
             }
+
+            if (removeListener) {
+                entry.returnTransitionListener = null;
+            }
         }
     }
+
+    if (removeListener) {
+        const listener = getAnimationListener();
+        clearAnimationListener(entry.enterAnimator, listener);
+        clearAnimationListener(entry.exitAnimator, listener);
+        clearAnimationListener(entry.popEnterAnimator, listener);
+        clearAnimationListener(entry.popExitAnimator, listener);
+    }
 }
 
 function allowTransitionOverlap(fragment: android.app.Fragment): void {
@@ -487,155 +471,164 @@ function allowTransitionOverlap(fragment: android.app.Fragment): void {
     }
 }
 
-function setEnterTransition(navigationTransition: NavigationTransition, fragment: android.app.Fragment, transition: android.transition.Transition): void {
+function setEnterTransition(navigationTransition: NavigationTransition, entry: ExpandedEntry, transition: android.transition.Transition): void {
     setUpNativeTransition(navigationTransition, transition);
-    const listener = addNativeTransitionListener(fragment, transition);
+    const listener = addNativeTransitionListener(entry, transition);
+
     // attach listener to JS object so that it will be alive as long as entry.
-    getFragmentCallbacks(fragment).entry.enterTransitionListener = listener;
-    listener.enterTransition = transition;
+    entry.enterTransitionListener = listener;
+    const fragment: android.app.Fragment = entry.fragment;
     fragment.setEnterTransition(transition);
 }
 
-function setExitTransition(navigationTransition: NavigationTransition, fragment: android.app.Fragment, transition: android.transition.Transition): void {
+function setExitTransition(navigationTransition: NavigationTransition, entry: ExpandedEntry, transition: android.transition.Transition): void {
     setUpNativeTransition(navigationTransition, transition);
-    const listener = addNativeTransitionListener(fragment, transition);
+    const listener = addNativeTransitionListener(entry, transition);
+
     // attach listener to JS object so that it will be alive as long as entry.
-    getFragmentCallbacks(fragment).entry.exitTransitionListener = listener;
-    listener.exitTransition = transition;
+    entry.exitTransitionListener = listener;
+    const fragment: android.app.Fragment = entry.fragment;
     fragment.setExitTransition(transition);
 }
 
-function setReenterTransition(navigationTransition: NavigationTransition, fragment: android.app.Fragment, transition: android.transition.Transition): void {
+function setReenterTransition(navigationTransition: NavigationTransition, entry: ExpandedEntry, transition: android.transition.Transition): void {
     setUpNativeTransition(navigationTransition, transition);
-    const listener = addNativeTransitionListener(fragment, transition);
+    const listener = addNativeTransitionListener(entry, transition);
+
     // attach listener to JS object so that it will be alive as long as entry.
-    getFragmentCallbacks(fragment).entry.reenterTransitionListener = listener;
-    listener.reenterTransition = transition;
+    entry.reenterTransitionListener = listener;
+    const fragment: android.app.Fragment = entry.fragment;
     fragment.setReenterTransition(transition);
 }
 
-function setReturnTransition(navigationTransition: NavigationTransition, fragment: android.app.Fragment, transition: android.transition.Transition): void {
+function setReturnTransition(navigationTransition: NavigationTransition, entry: ExpandedEntry, transition: android.transition.Transition): void {
     setUpNativeTransition(navigationTransition, transition);
-    const listener = addNativeTransitionListener(fragment, transition);
+    const listener = addNativeTransitionListener(entry, transition);
+
     // attach listener to JS object so that it will be alive as long as entry.
-    getFragmentCallbacks(fragment).entry.returnTransitionListener = listener;
-    listener.returnTransition = transition;
+    entry.returnTransitionListener = listener;
+    const fragment: android.app.Fragment = entry.fragment;
     fragment.setReturnTransition(transition);
 }
 
-function setupNewFragmentSlideTransition(navTransition: NavigationTransition, fragment: android.app.Fragment, name: string): void {
+function setupNewFragmentSlideTransition(navTransition: NavigationTransition, entry: ExpandedEntry, name: string): void {
+    setupCurrentFragmentSlideTransition(navTransition, entry, name);
     const direction = name.substr("slide".length) || "left"; //Extract the direction from the string
     switch (direction) {
         case "left":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.LEFT));
-            setEnterTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.RIGHT));
+            setEnterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.RIGHT));
+            setReturnTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.RIGHT));
             break;
 
         case "right":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.RIGHT));
-            setEnterTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.LEFT));
+            setEnterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.LEFT));
+            setReturnTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.LEFT));
             break;
 
         case "top":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.TOP));
-            setEnterTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.BOTTOM));
+            setEnterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.BOTTOM));
+            setReturnTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.BOTTOM));
             break;
 
         case "bottom":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.BOTTOM));
-            setEnterTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.TOP));
+            setEnterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.TOP));
+            setReturnTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.TOP));
             break;
     }
 }
 
-function setupCurrentFragmentSlideTransition(navTransition: NavigationTransition, fragment: android.app.Fragment, name: string): void {
+function setupCurrentFragmentSlideTransition(navTransition: NavigationTransition, entry: ExpandedEntry, name: string): void {
     const direction = name.substr("slide".length) || "left"; //Extract the direction from the string
     switch (direction) {
         case "left":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.LEFT));
+            setExitTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.LEFT));
+            setReenterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.LEFT));
             break;
 
         case "right":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.RIGHT));
+            setExitTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.RIGHT));
+            setReenterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.RIGHT));
             break;
 
         case "top":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.TOP));
+            setExitTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.TOP));
+            setReenterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.TOP));
             break;
 
         case "bottom":
-            setExitTransition(navTransition, fragment, new android.transition.Slide(android.view.Gravity.BOTTOM));
+            setExitTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.BOTTOM));
+            setReenterTransition(navTransition, entry, new android.transition.Slide(android.view.Gravity.BOTTOM));
             break;
     }
 }
 
-function setupNewFragmentFadeTransition(navTransition: NavigationTransition, fragment: android.app.Fragment): void {
-    setupCurrentFragmentFadeTransition(navTransition, fragment);
+function setupNewFragmentFadeTransition(navTransition: NavigationTransition, entry: ExpandedEntry): void {
+    setupCurrentFragmentFadeTransition(navTransition, entry);
 
     const fadeInEnter = new android.transition.Fade(android.transition.Fade.IN);
-    setEnterTransition(navTransition, fragment, fadeInEnter);
+    setEnterTransition(navTransition, entry, fadeInEnter);
 
     const fadeOutReturn = new android.transition.Fade(android.transition.Fade.OUT);
-    setReturnTransition(navTransition, fragment, fadeOutReturn);
+    setReturnTransition(navTransition, entry, fadeOutReturn);
 }
 
-function setupCurrentFragmentFadeTransition(navTransition: NavigationTransition, fragment: android.app.Fragment): void {
+function setupCurrentFragmentFadeTransition(navTransition: NavigationTransition, entry: ExpandedEntry): void {
     const fadeOutExit = new android.transition.Fade(android.transition.Fade.OUT);
-    setExitTransition(navTransition, fragment, fadeOutExit);
+    setExitTransition(navTransition, entry, fadeOutExit);
 
     // NOTE: There is a bug in Fade transition so we need to set all 4
     // otherwise back navigation will complete immediately (won't run the reverse transition).
     const fadeInReenter = new android.transition.Fade(android.transition.Fade.IN);
-    setReenterTransition(navTransition, fragment, fadeInReenter);
+    setReenterTransition(navTransition, entry, fadeInReenter);
 }
 
-function setupCurrentFragmentExplodeTransition(navTransition: NavigationTransition, fragment: android.app.Fragment): void {
-    setExitTransition(navTransition, fragment, new android.transition.Explode());
+function setupCurrentFragmentExplodeTransition(navTransition: NavigationTransition, entry: ExpandedEntry): void {
+    setExitTransition(navTransition, entry, new android.transition.Explode());
+    setReenterTransition(navTransition, entry, new android.transition.Explode());
 }
 
-function setupNewFragmentExplodeTransition(navTransition: NavigationTransition, fragment: android.app.Fragment): void {
-    setExitTransition(navTransition, fragment, new android.transition.Explode());
-    setEnterTransition(navTransition, fragment, new android.transition.Explode());
+function setupNewFragmentExplodeTransition(navTransition: NavigationTransition, entry: ExpandedEntry): void {
+    setupCurrentFragmentExplodeTransition(navTransition, entry);
+
+    setEnterTransition(navTransition, entry, new android.transition.Explode());
+    setReturnTransition(navTransition, entry, new android.transition.Explode());
 }
 
-function setupExitAndPopEnterAnimation(fragment: android.app.Fragment, transition: Transition): void {
-    const entry = getFragmentCallbacks(fragment).entry;
+function setupExitAndPopEnterAnimation(entry: ExpandedEntry, transition: Transition): void {
     const listener = getAnimationListener();
 
+    // remove previous listener if we are changing the animator.
+    clearAnimationListener(entry.exitAnimator, listener);
+    clearAnimationListener(entry.popEnterAnimator, listener);
+
     const exitAnimator = <ExpandedAnimator>transition.createAndroidAnimator(AndroidTransitionType.exit);
     exitAnimator.transitionType = AndroidTransitionType.exit;
-    exitAnimator.fragment = fragment;
+    exitAnimator.entry = entry;
     exitAnimator.addListener(listener);
-    // remove previous listener if we are changing the animator.
-    clearAnimationListener(entry.exitAnimator, listener);
     entry.exitAnimator = exitAnimator;
 
     const popEnterAnimator = <ExpandedAnimator>transition.createAndroidAnimator(AndroidTransitionType.popEnter);
     popEnterAnimator.transitionType = AndroidTransitionType.popEnter;
-    popEnterAnimator.fragment = fragment;
+    popEnterAnimator.entry = entry;
     popEnterAnimator.addListener(listener);
-    // remove previous listener if we are changing the animator.
-    clearAnimationListener(entry.popEnterAnimator, listener);
     entry.popEnterAnimator = popEnterAnimator;
 }
 
-function setupAllAnimation(fragment: android.app.Fragment, transition: Transition): void {
-    setupExitAndPopEnterAnimation(fragment, transition);
-
-    const entry = getFragmentCallbacks(fragment).entry;
+function setupAllAnimation(entry: ExpandedEntry, transition: Transition): void {
+    setupExitAndPopEnterAnimation(entry, transition);
     const listener = getAnimationListener();
 
     // setupAllAnimation is called only for new fragments so we don't 
     // need to clearAnimationListener for enter & popExit animators.
     const enterAnimator = <ExpandedAnimator>transition.createAndroidAnimator(AndroidTransitionType.enter);
     enterAnimator.transitionType = AndroidTransitionType.enter;
-    enterAnimator.fragment = fragment;
+    enterAnimator.entry = entry;
     enterAnimator.addListener(listener);
     entry.enterAnimator = enterAnimator;
 
     const popExitAnimator = <ExpandedAnimator>transition.createAndroidAnimator(AndroidTransitionType.popExit);
     popExitAnimator.transitionType = AndroidTransitionType.popExit;
-    popExitAnimator.fragment = fragment;
+    popExitAnimator.entry = entry;
     popExitAnimator.addListener(listener);
     entry.popExitAnimator = popExitAnimator;
 }
@@ -649,20 +642,26 @@ function setUpNativeTransition(navigationTransition: NavigationTransition, nativ
     nativeTransition.setInterpolator(interpolator);
 }
 
-function transitionsCompleted(fragment: android.app.Fragment): boolean {
-    waitingQueue.delete(fragment);
-    return waitingQueue.size === 0;
+function addNativeTransitionListener(entry: ExpandedEntry, nativeTransition: android.transition.Transition): ExpandedTransitionListener {
+    const listener = getTransitionListener(entry, nativeTransition);
+    nativeTransition.addListener(listener);
+    return listener;
 }
 
 function transitionOrAnimationCompleted(fragment: android.app.Fragment): void {
-    if (transitionsCompleted(fragment)) {
+    waitingQueue.delete(fragment);
+    if (waitingQueue.size === 0) {
         const callbacks = getFragmentCallbacks(fragment);
         const entry = callbacks.entry;
         const frame = callbacks.frame;
         const setAsCurrent = frame.isCurrent(entry) ? fragmentCompleted : fragment;
 
         fragmentCompleted = null;
-        setTimeout(() => frame.setCurrent(getFragmentCallbacks(setAsCurrent).entry));
+        // Will be null if Frame is shown modally...
+        // AnimationCompleted fires again (probably bug in android).
+        if (setAsCurrent) {
+            setTimeout(() => frame.setCurrent(getFragmentCallbacks(setAsCurrent).entry));
+        }
     } else {
         fragmentCompleted = fragment;
     }
@@ -672,12 +671,6 @@ function toShortString(nativeTransition: android.transition.Transition): string
     return `${nativeTransition.getClass().getSimpleName()}@${nativeTransition.hashCode().toString(16)}`;
 }
 
-function addNativeTransitionListener(fragment: android.app.Fragment, nativeTransition: android.transition.Transition): ExpandedTransitionListener {
-    const listener = getTransitionListener(fragment);
-    nativeTransition.addListener(listener);
-    return listener;
-}
-
 function javaObjectArray(...params: java.lang.Object[]) {
     const nativeArray = Array.create(java.lang.Object, params.length);
     params.forEach((value, i) => nativeArray[i] = value);
@@ -713,20 +706,20 @@ function initDefaultAnimations(manager: android.app.FragmentManager): void {
     }
 }
 
-function getDefaultAnimation(enter: boolean): ExpandedAnimator {
+function getDefaultAnimation(enter: boolean): android.animation.Animator {
     const defaultAnimator = enter ? defaultEnterAnimatorStatic : defaultExitAnimatorStatic;
     return defaultAnimator ? defaultAnimator.clone() : null;
 }
 
-function createDummyZeroDurationAnimator(): ExpandedAnimator {
+function createDummyZeroDurationAnimator(): android.animation.Animator {
     const animator = android.animation.ValueAnimator.ofObject(intEvaluator(), javaObjectArray(java.lang.Integer.valueOf(0), java.lang.Integer.valueOf(1)));
     animator.setDuration(0);
     return animator;
 }
 
-function printTransitions(fragment: android.app.Fragment) {
-    if (fragment && traceEnabled()) {
-        const entry = getFragmentCallbacks(fragment).entry;
+function printTransitions(entry: ExpandedEntry) {
+    if (entry && traceEnabled()) {
+        const fragment = entry.fragment;
         let result = `${fragment} Transitions:`;
         if (entry.transitionName) {
             result += `transitionName=${entry.transitionName}, `;
@@ -746,4 +739,24 @@ function printTransitions(fragment: android.app.Fragment) {
         }
         traceWrite(result, traceCategories.Transition);
     }
+}
+
+class NoTransition extends Transition {
+    public createAndroidAnimator(transitionType: string): android.animation.Animator {
+        return createDummyZeroDurationAnimator();
+    }
+}
+
+class DefaultTransition extends Transition {
+    public createAndroidAnimator(transitionType: string): android.animation.Animator {
+        switch (transitionType) {
+            case AndroidTransitionType.enter:
+            case AndroidTransitionType.popEnter:
+                return getDefaultAnimation(true);
+
+            case AndroidTransitionType.popExit:
+            case AndroidTransitionType.exit:
+                return getDefaultAnimation(false);
+        }
+    }
 }
\ No newline at end of file
diff --git a/tns-core-modules/ui/frame/fragment.transitions.d.ts b/tns-core-modules/ui/frame/fragment.transitions.d.ts
index e9dfa4fbd..7a715adcb 100644
--- a/tns-core-modules/ui/frame/fragment.transitions.d.ts
+++ b/tns-core-modules/ui/frame/fragment.transitions.d.ts
@@ -2,15 +2,19 @@
  * @module "ui/transition"
  */ /** */
 
-import { NavigationTransition } from "../frame";
+import { NavigationTransition, BackstackEntry } from "../frame";
 
 //@private
 /**
- * Waits for animation/transition end on the given fragments.
- * @param newFragment 
- * @param currentFragment 
+ * @private
  */
-export function _waitForAnimationEnd(newFragment, currentFragment): void;
+export const enum AnimationType {
+    enterFakeResourceId = -10,
+    exitFakeResourceId = -20,
+    popEnterFakeResourceId = -30,
+    popExitFakeResourceId = -40
+}
+
 /**
  * @private
  */
@@ -27,8 +31,30 @@ export function _setAndroidFragmentTransitions(
 export function _onFragmentCreateAnimator(fragment: any, nextAnim: number): any;
 /**
  * @private
+ * Called once fragment is recreated after it was destroyed.
+ * Reapply animations and transitions from entry to fragment if any.
  */
-export function _updateAnimationFragment(newFragment: any): void;
+export function _updateTransitions(entry: BackstackEntry): void;
+/**
+ * @private
+ * Called once fragment is going to reappear from backstack.
+ * Reverse transitions from entry to fragment if any.
+ */
+export function _reverseTransitions(previousEntry: BackstackEntry, currentEntry: BackstackEntry): boolean;
+/**
+ * @private
+ * Called when entry is removed from backstack (either back navigation or
+ * navigate with clear history). Removes all animations and transitions from entry
+ * and fragment and clears all listeners in order to prevent memory leaks.
+ */
+export function _clearEntry(entry: BackstackEntry): void;
+/**
+ * @private
+ * Called when fragment is destroyed because activity is destroyed.
+ * Removes all animations and transitions but keeps them on the entry
+ * in order to reapply them when new fragment is created for the same entry.
+ */
+export function _clearFragment(fragment: any): void;
 /**
  * @private
  */
diff --git a/tns-core-modules/ui/frame/frame-common.ts b/tns-core-modules/ui/frame/frame-common.ts
index 5a46cef94..f071baed3 100644
--- a/tns-core-modules/ui/frame/frame-common.ts
+++ b/tns-core-modules/ui/frame/frame-common.ts
@@ -190,9 +190,9 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
 
     private _animated: boolean;
     public _currentEntry: BackstackEntry;
-    private _backStack: Array<BackstackEntry>;
     private _transition: NavigationTransition;
-    private _navigationQueue: Array<NavigationContext>;
+    private _backStack = new Array<BackstackEntry>();
+    private _navigationQueue = new Array<NavigationContext>();
 
     public _isInFrameStack = false;
     public static defaultAnimatedNavigation = true;
@@ -200,13 +200,6 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
 
     // TODO: Currently our navigation will not be synchronized in case users directly call native navigation methods like Activity.startActivity.
 
-    constructor() {
-        super();
-
-        this._backStack = new Array<BackstackEntry>();
-        this._navigationQueue = new Array<NavigationContext>();
-    }
-
     public canGoBack(): boolean {
         return this._backStack.length > 0;
     }
@@ -219,22 +212,20 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
         if (traceEnabled()) {
             traceWrite(`GO BACK`, traceCategories.Navigation);
         }
+
         if (!this.canGoBack()) {
             // TODO: Do we need to throw an error?
             return;
         }
 
-        if (!backstackEntry) {
-            backstackEntry = this._backStack.pop();
-        } else {
-            let backIndex = this._backStack.indexOf(backstackEntry);
+        if (backstackEntry) {
+            const backIndex = this._backStack.indexOf(backstackEntry);
             if (backIndex < 0) {
                 return;
             }
-            this._backStack.splice(backIndex);
         }
 
-        let navigationContext: NavigationContext = {
+        const navigationContext: NavigationContext = {
             entry: backstackEntry,
             isBackNavigation: true
         }
@@ -251,6 +242,10 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
         }
     }
 
+    public _removeBackstackEntries(removed: BackstackEntry[]): void {
+        // Handled in android.
+    }
+
     // Attempts to implement https://github.com/NativeScript/NativeScript/issues/1311
     // private _subscribedToOrientationChangedEvent = false;
     // private _onOrientationChanged(){
@@ -390,13 +385,17 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
         }
     }
 
+    public _clearBackStack(): void {
+        this._backStack.length = 0;
+    }
+
     @profile
     private performNavigation(navigationContext: NavigationContext) {
         let navContext = navigationContext.entry;
 
         // TODO: This should happen once navigation is completed.
         if (navigationContext.entry.entry.clearHistory) {
-            this._backStack.length = 0;
+            // Don't clear backstack immediately or we can't remove pages from frame.
         } else if (FrameBase._isEntryBackstackVisible(this._currentEntry)) {
             this._backStack.push(this._currentEntry);
         }
@@ -407,9 +406,19 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
 
     @profile
     private performGoBack(navigationContext: NavigationContext) {
-        const navContext = navigationContext.entry;
-        this._onNavigatingTo(navContext, navigationContext.isBackNavigation);
-        this._goBackCore(navContext);
+        let backstackEntry = navigationContext.entry;
+        if (!backstackEntry) {
+            backstackEntry = this._backStack.pop();
+            navigationContext.entry = backstackEntry;
+        } else {
+            const index = this._backStack.indexOf(backstackEntry);
+            const removed = this._backStack.splice(index + 1);
+            this._backStack.pop();
+            this._removeBackstackEntries(removed);
+        }
+       
+        this._onNavigatingTo(backstackEntry, true);
+        this._goBackCore(backstackEntry);
     }
 
     public _goBackCore(backstackEntry: BackstackEntry) {
diff --git a/tns-core-modules/ui/frame/frame.android.ts b/tns-core-modules/ui/frame/frame.android.ts
index 9527e44cd..d02affc59 100644
--- a/tns-core-modules/ui/frame/frame.android.ts
+++ b/tns-core-modules/ui/frame/frame.android.ts
@@ -8,13 +8,15 @@ import { Page } from "../page";
 // Types.
 import { FrameBase, application, NavigationContext, stack, goBack, View, Observable, traceEnabled, traceWrite, traceCategories } from "./frame-common";
 import { DIALOG_FRAGMENT_TAG } from "../page/constants";
-import { _setAndroidFragmentTransitions, _waitForAnimationEnd, _onFragmentCreateAnimator, _updateAnimationFragment } from "./fragment.transitions";
+import {
+    _setAndroidFragmentTransitions, _onFragmentCreateAnimator,
+    _updateTransitions, _reverseTransitions, _clearEntry, _clearFragment, AnimationType
+} from "./fragment.transitions";
 
 import { profile } from "../../profiling";
 
 export * from "./frame-common";
 
-const HIDDEN = "_hidden";
 const INTENT_EXTRA = "com.tns.activity";
 const FRAMEID = "_frameId";
 const CALLBACKS = "_callbacks";
@@ -32,7 +34,7 @@ export class Frame extends FrameBase {
     private _android: AndroidFrame;
     private _delayedNavigationEntry: BackstackEntry;
     private _containerViewId: number = -1;
-    private _isBack: boolean = true;
+    public _isBack: boolean = true;
 
     constructor() {
         super();
@@ -74,6 +76,7 @@ export class Frame extends FrameBase {
         callbacks.entry = backstackEntry;
 
         // backstackEntry
+        backstackEntry.fragment = newFragment;
         backstackEntry.fragmentTag = fragmentTag;
         backstackEntry.navDepth = navDepth;
 
@@ -91,8 +94,10 @@ export class Frame extends FrameBase {
         const isBack = this._isBack;
         let page: Page = this.currentPage;
         if (page) {
-            if (page.frame === this && isBack) {
-                this._removeView(page);
+            if (page.frame === this &&
+                (isBack || this.backStack.indexOf(this._currentEntry) < 0)) {
+                // If going back or navigate forward but current entry is not backstack visible.
+                removeEntry(this._currentEntry, page, this, true);
             }
 
             if (page.isLoaded) {
@@ -143,50 +148,57 @@ export class Frame extends FrameBase {
         fragmentId++;
         const newFragmentTag = `fragment${fragmentId}[${navDepth}]`;
         const newFragment = this.createFragment(backstackEntry, newFragmentTag);
-        const fragmentTransaction = manager.beginTransaction();
-
+        const transaction = manager.beginTransaction();
         const animated = this._getIsAnimatedNavigation(backstackEntry.entry);
         // NOTE: Don't use transition for the initial nagivation (same as on iOS)
-        //. On API 21+ transition won't be triggered unless there was at least one
+        // On API 21+ transition won't be triggered unless there was at least one
         // layout pass so we will wait forever for transitionCompleted handler...
         // https://github.com/NativeScript/NativeScript/issues/4895
         const navigationTransition = this._currentEntry ? this._getNavigationTransition(backstackEntry.entry) : null;
 
-        _setAndroidFragmentTransitions(animated, navigationTransition, currentFragment, newFragment, fragmentTransaction, manager);
-        if (currentFragment) {
-            if (clearHistory) {
-                removeFragments(manager, fragmentTransaction);
-            } else {
-                fragmentTransaction.addToBackStack(this._currentEntry.fragmentTag);
-            }
-
-            if (animated && !navigationTransition) {
-                fragmentTransaction.setTransition(android.app.FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
-            }
-        }
-
-        fragmentTransaction.replace(this.containerViewId, newFragment, newFragmentTag);
-        fragmentTransaction.commit();
-
+        _setAndroidFragmentTransitions(animated, navigationTransition, currentFragment, newFragment, transaction, manager);
         if (clearHistory) {
-            manager.popBackStackImmediate(null, android.app.FragmentManager.POP_BACK_STACK_INCLUSIVE);
+            destroyPages(this.backStack, true);
+            this._clearBackStack();
         }
+
+        if (currentFragment && animated && !navigationTransition) {
+            transaction.setTransition(android.app.FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
+        }
+
+        transaction.replace(this.containerViewId, newFragment, newFragmentTag);
+        transaction.commit();
     }
 
     public _goBackCore(backstackEntry: BackstackEntry) {
         super._goBackCore(backstackEntry);
-
         navDepth = backstackEntry.navDepth;
-        const manager = this._android.activity.getFragmentManager();
-        if (manager.getBackStackEntryCount() > 0) {
-            const fragmentInBackstack = manager.findFragmentByTag(backstackEntry.fragmentTag);
-            const currentFragment = manager.findFragmentByTag(this._currentEntry.fragmentTag);
 
-            _waitForAnimationEnd(fragmentInBackstack, currentFragment);
-            // pop all other fragments up until the named one
-            // this handles cases where user may navigate to an inner page without adding it on the backstack
-            manager.popBackStack(backstackEntry.fragmentTag, android.app.FragmentManager.POP_BACK_STACK_INCLUSIVE);
+        const activity = this._android.activity;
+        const manager = activity.getFragmentManager();
+        const transaction = manager.beginTransaction();
+
+        if (!backstackEntry.fragment) {
+            // Happens on newer API levels. On older all fragments
+            // are recreated once activity is created.
+            // This entry fragment was destroyed by app suspend.
+            // We need to recreate its animations and then reverse it.
+            backstackEntry.fragment = this.createFragment(backstackEntry, backstackEntry.fragmentTag);
+            _updateTransitions(backstackEntry);
         }
+
+        const transitionReversed = _reverseTransitions(backstackEntry, this._currentEntry);
+        if (!transitionReversed) {
+            // If transition were not reversed then use animations.
+            transaction.setCustomAnimations(AnimationType.popEnterFakeResourceId, AnimationType.popExitFakeResourceId, AnimationType.enterFakeResourceId, AnimationType.exitFakeResourceId);
+        }
+
+        transaction.replace(this.containerViewId, backstackEntry.fragment, backstackEntry.fragmentTag);
+        transaction.commit();
+    }
+
+    public _removeBackstackEntries(removed: BackstackEntry[]): void {
+        destroyPages(removed, true);
     }
 
     public createNativeView() {
@@ -246,6 +258,19 @@ export class Frame extends FrameBase {
         return true;
     }
 
+    public _saveFragmentsState(): void {
+        // We save only fragments in backstack.
+        // Current fragment is saved by FragmentManager.
+        this.backStack.forEach((entry) => {
+            const view: android.view.View = entry.resolvedPage.nativeViewProtected;
+            if (!entry.viewSavedState && view) {
+                const viewState = new android.util.SparseArray<android.os.Parcelable>();
+                view.saveHierarchyState(viewState);
+                entry.viewSavedState = viewState;
+            }
+        });
+    }
+
     protected _processNavigationContext(navigationContext: NavigationContext) {
         let activity = this._android.activity;
         if (activity) {
@@ -294,23 +319,38 @@ export class Frame extends FrameBase {
     }
 }
 
-function removeFragments(manager: android.app.FragmentManager, ft: android.app.FragmentTransaction): void {
+function removeEntry(entry: BackstackEntry, page: Page, frame: View, entryUnused: boolean): void {
+    if (entry.fragment) {
+        if (entryUnused) {
+            _clearEntry(entry);
+        } else {
+            _clearFragment(entry.fragment);
+        }
+    }
+
+    entry.fragment = null;
+    if (entryUnused) {
+        entry.viewSavedState = null;
+    }
+
+    if (frame) {
+        frame._removeView(page);
+    }
+}
+
+function destroyPages(backStack: Array<BackstackEntry>, entryUnused: boolean): void {
     if (traceEnabled()) {
         traceWrite(`CLEAR HISTORY`, traceCategories.Navigation);
     }
 
-    for (let i = manager.getBackStackEntryCount() - 1; i >= 0; i--) {
-        const fragment = manager.findFragmentByTag(manager.getBackStackEntryAt(i).getName());
-        ft.detach(fragment);
-        const page = fragment[CALLBACKS].entry.resolvedPage;
-        if (page.frame) {
-            page.frame._removeView(page);
-        }
-    }
+    backStack.forEach((entry) => {
+        const page = entry.resolvedPage;
+        removeEntry(entry, page, page.frame, entryUnused);
+    });
 }
 
 let framesCounter = 0;
-let framesCache: Array<WeakRef<AndroidFrame>> = new Array<WeakRef<AndroidFrame>>();
+let framesCache = new Array<WeakRef<AndroidFrame>>();
 
 class AndroidFrame extends Observable implements AndroidFrameDefinition {
     public rootViewGroup: android.view.ViewGroup;
@@ -435,7 +475,8 @@ function findPageForFragment(fragment: android.app.Fragment, frame: Frame) {
         const callbacks: FragmentCallbacksImplementation = fragment[CALLBACKS];
         callbacks.frame = frame;
         callbacks.entry = entry;
-        _updateAnimationFragment(fragment);
+        entry.fragment = fragment;
+        _updateTransitions(entry);
     } else {
         throw new Error(`Could not find a page for ${fragmentTag}.`);
     }
@@ -547,10 +588,6 @@ class FragmentCallbacksImplementation implements AndroidFragmentCallbacks {
         const entry = this.entry;
         const page = entry.resolvedPage;
         try {
-            if (savedInstanceState && savedInstanceState.getBoolean(HIDDEN, false)) {
-                fragment.getFragmentManager().beginTransaction().hide(fragment).commit();
-            }
-
             const frame = this.frame;
             if (page.parent === frame) {
                 if (frame.isLoaded && !page.isLoaded) {
@@ -565,6 +602,12 @@ class FragmentCallbacksImplementation implements AndroidFragmentCallbacks {
             return label;
         }
 
+        const savedState = entry.viewSavedState;
+        if (savedState) {
+            (<android.view.View>page.nativeViewProtected).restoreHierarchyState(savedState);
+            entry.viewSavedState = null;
+        }
+
         return page.nativeViewProtected;
     }
 
@@ -574,15 +617,10 @@ class FragmentCallbacksImplementation implements AndroidFragmentCallbacks {
             traceWrite(`${fragment}.onSaveInstanceState(${outState})`, traceCategories.NativeLifecycle);
         }
         superFunc.call(fragment, outState);
-        if (fragment.isHidden()) {
-            outState.putBoolean(HIDDEN, true);
-        }
     }
 
     @profile
     public onDestroyView(fragment: android.app.Fragment, superFunc: Function): void {
-        const entry = this.entry;
-        const page = entry.resolvedPage;
         if (traceEnabled()) {
             traceWrite(`${fragment}.onDestroyView()`, traceCategories.NativeLifecycle);
         }
@@ -591,16 +629,10 @@ class FragmentCallbacksImplementation implements AndroidFragmentCallbacks {
 
     @profile
     public onDestroy(fragment: android.app.Fragment, superFunc: Function): void {
-        const entry = this.entry;
-        const page = entry.resolvedPage;
-        superFunc.call(fragment);
-
-        const frame = page.frame;
-        // This will happen if we navigate forward then kill the app
-        // Existing pages will be in the frame so we need to destory them.
-        if (frame && !frame.isCurrent(entry)) {
-            frame._removeView(page);
+        if (traceEnabled()) {
+            traceWrite(`${fragment}.onDestroy()`, traceCategories.NativeLifecycle);
         }
+        superFunc.call(fragment);
     }
 
     @profile
@@ -671,7 +703,7 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks {
         // Initialize native visual tree;
         rootView._setupAsRootView(activity);
         activity.setContentView(rootView.nativeViewProtected, new org.nativescript.widgets.CommonLayoutParams());
-        // frameId is negative w
+
         if (frame) {
             frame.navigate(navParam);
         }
@@ -689,9 +721,10 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks {
     @profile
     public onSaveInstanceState(activity: android.app.Activity, outState: android.os.Bundle, superFunc: Function): void {
         superFunc.call(activity, outState);
-        let view = this._rootView;
-        if (view instanceof Frame) {
-            outState.putInt(INTENT_EXTRA, view.android.frameId);
+        const frame = this._rootView;
+        if (frame instanceof Frame) {
+            outState.putInt(INTENT_EXTRA, frame.android.frameId);
+            frame._saveFragmentsState();
         }
     }
 
@@ -702,7 +735,8 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks {
         if (traceEnabled()) {
             traceWrite("NativeScriptActivity.onStart();", traceCategories.NativeLifecycle);
         }
-        let rootView = this._rootView;
+
+        const rootView = this._rootView;
         if (rootView && !rootView.isLoaded) {
             rootView.onLoaded();
         }
@@ -715,7 +749,8 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks {
         if (traceEnabled()) {
             traceWrite("NativeScriptActivity.onStop();", traceCategories.NativeLifecycle);
         }
-        let rootView = this._rootView;
+
+        const rootView = this._rootView;
         if (rootView && rootView.isLoaded) {
             rootView.onUnloaded();
         }
@@ -723,7 +758,7 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks {
 
     @profile
     public onDestroy(activity: any, superFunc: Function): void {
-        let rootView = this._rootView;
+        const rootView = this._rootView;
         if (rootView && rootView._context) {
             rootView._tearDownUI(true);
         }
@@ -736,6 +771,10 @@ class ActivityCallbacksImplementation implements AndroidActivityCallbacks {
 
         const exitArgs = { eventName: application.exitEvent, object: application.android, android: activity };
         application.notify(exitArgs);
+
+        if (rootView instanceof Frame) {
+            destroyPages(rootView.backStack, false);
+        }
     }
 
     @profile
@@ -801,4 +840,4 @@ export function setActivityCallbacks(activity: android.app.Activity): void {
 
 export function setFragmentCallbacks(fragment: android.app.Fragment): void {
     fragment[CALLBACKS] = new FragmentCallbacksImplementation();
-}
+}
\ No newline at end of file
diff --git a/tns-core-modules/ui/frame/frame.d.ts b/tns-core-modules/ui/frame/frame.d.ts
index a2eb65553..f26b6986a 100644
--- a/tns-core-modules/ui/frame/frame.d.ts
+++ b/tns-core-modules/ui/frame/frame.d.ts
@@ -136,6 +136,14 @@ export class Frame extends View {
      * @private
      */
     _findEntryForTag(fragmentTag: string): BackstackEntry;
+    /**
+     * @private
+     */
+    _clearBackStack(): void;
+    /**
+     * @private
+     */
+    _isBack?: boolean;
     //@endprivate
 
     /**
@@ -284,6 +292,14 @@ export interface BackstackEntry {
      * @private
      */
     fragmentTag: string;
+    /**
+     * @private
+     */
+    fragment?: any;
+    /**
+     * @private
+     */
+    viewSavedState?: any;
     //@endprivate
 }
 
diff --git a/tns-core-modules/ui/frame/frame.ios.ts b/tns-core-modules/ui/frame/frame.ios.ts
index 46c8e94eb..e67b862bc 100644
--- a/tns-core-modules/ui/frame/frame.ios.ts
+++ b/tns-core-modules/ui/frame/frame.ios.ts
@@ -82,6 +82,7 @@ export class Frame extends FrameBase {
 
         let clearHistory = backstackEntry.entry.clearHistory;
         if (clearHistory) {
+            this._clearBackStack();
             navDepth = -1;
         }
         navDepth++;
@@ -126,7 +127,7 @@ export class Frame extends FrameBase {
         // We should clear the entire history.
         if (clearHistory) {
             viewController.navigationItem.hidesBackButton = true;
-            let newControllers = NSMutableArray.alloc().initWithCapacity(1);
+            const newControllers = NSMutableArray.alloc().initWithCapacity(1);
             newControllers.addObject(viewController);
 
             // Mark all previous ViewControllers as cleared