8000 fix(android): RootLayout shade cover unexpected delay (#10752) · NativeScript/NativeScript@2da4170 · GitHub
[go: up one dir, main page]

Skip to content

Commit 2da4170

Browse files
authored
fix(android): RootLayout shade cover unexpected delay (#10752)
1 parent 242c3ae commit 2da4170

File tree

1 file changed

+32
-22
lines changed

1 file changed

+32
-22
lines changed

packages/core/ui/layouts/root-layout/index.android.ts

Lines changed: 32 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { RootLayoutBase, defaultShadeCoverOptions } from './root-layout-common';
44
import { TransitionAnimation, ShadeCoverOptions } from '.';
55
import { parseLinearGradient } from '../../../css/parser';
66
import { LinearGradient } from '../../styling/linear-gradient';
7+
import { layout } from '../../../utils';
78

89
export * from './root-layout-common';
910

@@ -38,11 +39,20 @@ export class RootLayout extends RootLayoutBase {
3839
}
3940

4041
protected _initShadeCover(view: View, shadeOptions: ShadeCoverOptions): void {
41-
const initialState = <TransitionAnimation>{
42+
const options = <TransitionAnimation>{
4243
...defaultShadeCoverOptions.animation.enterFrom,
4344
...shadeOptions?.animation?.enterFrom,
4445
};
45-
this._playAnimation(this._getAnimationSet(view, initialState));
46+
const nativeView: android.view.View = view?.nativeViewProtected;
47+
48+
if (nativeView) {
49+
nativeView.setAlpha(options.opacity);
50+
nativeView.setScaleX(float(options.scaleX));
51+
nativeView.setScaleY(float(options.scaleY));
52+
nativeView.setTranslationX(layout.toDevicePixels(options.translateX));
53+
nativeView.setTranslationY(layout.toDevicePixels(options.translateY));
54+
nativeView.setRotation(float(options.rotate));
55+
}
4656
}
4757

4858
protected _updateShadeCover(view: View, shadeOptions: ShadeCoverOptions): Promise<void> {
@@ -51,6 +61,20 @@ export class RootLayout extends RootLayoutBase {
5161
...shadeOptions,
5262
};
5363
const duration = options.animation?.enterFrom?.duration || defaultShadeCoverOptions.animation.enterFrom.duration;
64+
const isBackgroundGradient = options.color && options.color.startsWith('linear-gradient');
65+
66+
if (isBackgroundGradient) {
67+
if (view.backgroundColor) {
68+
view.backgroundColor = undefined;
69+
}
70+
const parsedGradient = parseLinearGradient(options.color);
71+
view.backgroundImage = LinearGradient.parse(parsedGradient.value);
72+
} else {
73+
if (view.backgroundImage) {
74+
view.backgroundImage = undefined;
75+
}
76+
}
77+
5478
return this._playAnimation(
5579
this._getAnimationSet(
5680
view,
@@ -62,7 +86,7 @@ export class RootLayout extends RootLayoutBase {
6286
rotate: 0,
6387
opacity: options.opacity,
6488
},
65-
options.color,
89+
isBackgroundGradient ? null : options.color,
6690
),
6791
duration,
6892
);
@@ -77,30 +101,16 @@ export class RootLayout extends RootLayoutBase {
77101
}
78102

79103
private _getAnimationSet(view: View, shadeCoverAnimation: TransitionAnimation, backgroundColor?: string): Array<android.animation.Animator> {
80-
const isBackgroundGradient = backgroundColor && backgroundColor.startsWith('linear-gradient');
81-
82-
const animationSet = Array.create(android.animation.Animator, !backgroundColor || isBackgroundGradient ? 6 : 7);
83-
animationSet[0] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'translationX', [shadeCoverAnimation.translateX]);
84-
animationSet[1] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'translationY', [shadeCoverAnimation.translateY]);
104+
const animationSet = Array.create(android.animation.Animator, backgroundColor ? 7 : 6);
105+
animationSet[0] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'translationX', [layout.toDevicePixels(shadeCoverAnimation.translateX)]);
106+
animationSet[1] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'translationY', [layout.toDevicePixels(shadeCoverAnimation.translateY)]);
85107
animationSet[2] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'scaleX', [shadeCoverAnimation.scaleX]);
86108
animationSet[3] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'scaleY', [shadeCoverAnimation.scaleY]);
87109
animationSet[4] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'rotation', [shadeCoverAnimation.rotate]);
88110
animationSet[5] = android.animation.ObjectAnimator.ofFloat(view.nativeViewProtected, 'alpha', [shadeCoverAnimation.opacity]);
89111

90-
if (isBackgroundGradient) {
91-
if (view.backgroundColor) {
92-
view.backgroundColor = undefined;
93-
}
94-
const parsedGradient = parseLinearGradient(backgroundColor);
95-
view.backgroundImage = LinearGradient.parse(parsedGradient.value);
96-
} else {
97-
if (view.backgroundImage) {
98-
view.backgroundImage = undefined;
99-
}
100-
101-
if (backgroundColor) {
102-
animationSet[6] = this._getBackgroundColorAnimator(view, backgroundColor);
103-
}
112+
if (backgroundColor) {
113+
animationSet[6] = this._getBackgroundColorAnimator(view, backgroundColor);
104114
}
105115
return animationSet;
106116
}

0 commit comments

Comments
 (0)
0