feat(transitions): support zIndex on ios shared elements + support page props on android (#10261)

This commit is contained in:
Nathan Walker
2023-04-17 08:54:09 -07:00
committed by GitHub
parent f8edee43a0
commit f4b2722bf4
38 changed files with 740 additions and 371 deletions

View File

@@ -1,4 +1,5 @@
import { PageTransition, SharedTransition, SharedTransitionHelper, Transition } from '@nativescript/core';
import { PageTransition, SharedTransition, SharedTransitionAnimationType, SharedTransitionHelper, Transition, Utils } from '@nativescript/core';
import { CORE_ANIMATION_DEFAULTS } from '@nativescript/core/utils';
export class CustomTransition extends Transition {
constructor(duration: number, curve: any) {
@@ -72,9 +73,24 @@ class PageTransitionController extends NSObject implements UIViewControllerAnima
transitionDuration(transitionContext: UIViewControllerContextTransitioning): number {
const owner = this.owner.deref();
if (owner) {
return owner.getDuration();
const state = SharedTransition.getState(owner.id);
switch (state?.activeType) {
case SharedTransitionAnimationType.present:
if (Utils.isNumber(state?.pageEnd?.duration)) {
return state.pageEnd?.duration / 1000;
} else {
return Utils.getDurationWithDampingFromSpring(state.pageEnd?.spring).duration;
}
case SharedTransitionAnimationType.dismiss:
if (Utils.isNumber(state?.pageReturn?.duration)) {
return state.pageReturn?.duration / 1000;
} else {
return Utils.getDurationWithDampingFromSpring(state.pageReturn?.spring).duration;
}
}
}
return 0.35;
return CORE_ANIMATION_DEFAULTS.duration;
}
animateTransition(transitionContext: UIViewControllerContextTransitioning): void {

View File

@@ -52,8 +52,8 @@ export function test_Transitions() {
// helper.navigateWithEntry({ create: mainPageFactory, clearHistory: true, animated: false });
}
export function test_SharedElementTransitions() {
helper.navigate(() => {
export function test_SharedElementTransitions(done) {
const mainPage = helper.navigate(() => {
const page = new Page();
page.id = 'SharedelementTransitionsTestPage_MAIN';
page.style.backgroundColor = new Color(255, Math.round(Math.random() * 255), Math.round(Math.random() * 255), Math.round(Math.random() * 255));
@@ -76,12 +76,12 @@ export function test_SharedElementTransitions() {
const navigationTransition = SharedTransition.custom(new CustomSharedElementPageTransition());
var testId = `SharedElementTransition[${JSON.stringify(navigationTransition)}]`;
const testId = `SharedElementTransition[${JSON.stringify(navigationTransition)}]`;
if (Trace.isEnabled()) {
Trace.write(`Testing ${testId}`, Trace.categories.Test);
}
var navigationEntry: NavigationEntry = {
create: function (): Page {
const navigationEntry: NavigationEntry = {
create(): Page {
let page = new Page();
page.id = testId;
page.style.backgroundColor = new Color(255, Math.round(Math.random() * 255), Math.round(Math.random() * 255), Math.round(Math.random() * 255));
@@ -99,11 +99,16 @@ export function test_SharedElementTransitions() {
grid.addChild(sharedElement);
page.content = grid;
page.once('navigatedTo', () => {
done();
});
return page;
},
animated: true,
transition: navigationTransition,
};
helper.navigateWithEntry(navigationEntry);
mainPage.frame.navigate(navigationEntry);
}