mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
refactor(NavController): improve transitions, view stages
This refactor made it so view transitions do no step on one another when a new transition happens during an active transition.
This commit is contained in:
@@ -554,7 +554,7 @@ export class Animation {
|
||||
/*
|
||||
STATIC CLASSES
|
||||
*/
|
||||
static create(element, name) {
|
||||
static create(name) {
|
||||
let AnimationClass = AnimationRegistry[name];
|
||||
|
||||
if (!AnimationClass) {
|
||||
@@ -562,7 +562,7 @@ export class Animation {
|
||||
// fallback to just the base Animation class
|
||||
AnimationClass = Animation;
|
||||
}
|
||||
return new AnimationClass(element);
|
||||
return new AnimationClass();
|
||||
}
|
||||
|
||||
static createTransition(enteringView: ViewController, leavingView: ViewController, opts: any = {}) {
|
||||
|
||||
@@ -16,8 +16,8 @@ class IOSTransition extends Animation {
|
||||
constructor(enteringView, leavingView, opts) {
|
||||
super(null, opts);
|
||||
|
||||
this.duration(DURATION);
|
||||
this.easing(EASING);
|
||||
this.duration(opts.duration || DURATION);
|
||||
this.easing(opts.easing || EASING);
|
||||
|
||||
// what direction is the transition going
|
||||
let backDirection = (opts.direction === 'back');
|
||||
|
||||
@@ -24,11 +24,11 @@ class MDTransition extends Animation {
|
||||
this.add(enteringPage);
|
||||
|
||||
if (backDirection) {
|
||||
this.duration(200).easing('cubic-bezier(0.47,0,0.745,0.715)');
|
||||
this.duration(opts.duration || 200).easing('cubic-bezier(0.47,0,0.745,0.715)');
|
||||
enteringPage.fromTo(TRANSLATEY, CENTER, CENTER);
|
||||
|
||||
} else {
|
||||
this.duration(280).easing('cubic-bezier(0.36,0.66,0.04,1)');
|
||||
this.duration(opts.duration || 280).easing('cubic-bezier(0.36,0.66,0.04,1)');
|
||||
enteringPage
|
||||
.fromTo(TRANSLATEY, OFF_BOTTOM, CENTER)
|
||||
.fadeIn();
|
||||
@@ -51,7 +51,7 @@ class MDTransition extends Animation {
|
||||
// setup leaving view
|
||||
if (leavingView && backDirection) {
|
||||
// leaving content
|
||||
this.duration(200).easing('cubic-bezier(0.47,0,0.745,0.715)');
|
||||
this.duration(opts.duration || 200).easing('cubic-bezier(0.47,0,0.745,0.715)');
|
||||
let leavingPage = new Animation(leavingView.pageRef());
|
||||
this.add(leavingPage.fromTo(TRANSLATEY, CENTER, OFF_BOTTOM).fadeOut());
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user