8000 fix(ios): prevent animator from animating colors on shadow layer (#10… · NativeScript/NativeScript@79a0306 · GitHub
[go: up one dir, main page]
Skip to content

Commit 79a0306

Browse files
CatchABusCatchABus
authored
fix(ios): prevent animator from animating colors on shadow layer (#10686)
1 parent 966dccd commit 79a0306

File tree

3 files changed

+14
-13
lines changed

3 files changed

+14
-13
lines changed

‎packages/core/ui/animation/index.ios.ts

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -477,9 +477,11 @@ export class Animation extends AnimationBase {
477477
this.animateNestedLayerSizeUsingBasicAnimation(nativeView, args.toValue.CGRectValue, animation, args, nativeAnimation);
478478
}
479479

480-
// Shadow layers do not inherit from animating view layer
481-
if (nativeView.outerShadowContainerLayer) {
482-
nativeView.outerShadowContainerLayer.addAnimationForKey(nativeAnimation, args.propertyNameToAnimate);
480+
// Shadow container layer belongs to the parent view layer, so animate all its properties (except for colors) separately
481+
if (args.propertyNameToAnimate && !args.propertyNameToAnimate.endsWith('Color')) {
482+
if (nativeView.outerShadowContainerLayer) {
483+
nativeView.outerShadowContainerLayer.addAnimationForKey(nativeAnimation, args.propertyNameToAnimate);
484+
}
483485
}
484486
}
485487
let callback = undefined;
@@ -594,7 +596,7 @@ export class Animation extends AnimationBase {
594596
animation._originalValue = nativeView.layer.transform;
595597
nativeView.layer.setValueForKey(args.toValue, args.propertyNameToAnimate);
596598

597-
// Shadow layers do not inherit from animating view layer
599+
// Shadow container layer belongs to the parent view layer, so animate its transform separately
598600
if (nativeView.outerShadowContainerLayer) {
599601
nativeView.outerShadowContainerLayer.setValueForKey(args.toValue, args.propertyNameToAnimate);
600602
}
@@ -859,7 +861,7 @@ export class Animation extends AnimationBase {
859861
}
860862
}
861863

862-
// Shadow layers do not inherit from animating view layer
864+
// Shadow container layer belongs to the parent view layer, so animate its properties separately
863865
if (nativeView.outerShadowContainerLayer) {
864866
const shadowClipMask = nativeView.outerShadowContainerLayer.mask;
865867

‎packages/core/ui/core/view/index.ios.ts

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ export class View extends ViewCommon implements ViewDefinition {
4141
*/
4242
private _modalAnimatedOptions: Array<boolean>;
4343
private _isLaidOut = false;
44-
private _hasTransform = false;
44+
private _isTransformed = false;
4545
private _privateFlags: number = PFLAG_LAYOUT_REQUIRED | PFLAG_FORCE_LAYOUT;
4646
private _cachedFrame: CGRect;
4747
private _suspendCATransaction = false;
@@ -66,7 +66,7 @@ export class View extends ViewCommon implements ViewDefinition {
6666

6767
this._cachedFrame = null;
6868
this._isLaidOut = false;
69-
this._hasTransform = false;
69+
this._isTransformed = false;
7070
}
7171

7272
public requestLayout(): void {
@@ -211,7 +211,7 @@ export class View extends ViewCommon implements ViewDefinition {
211211
this._cachedFrame = frame;
212212
let adjustedFrame = null;
213213
let transform = null;
214-
if (this._hasTransform) {
214+
if (this._isTransformed) {
215215
// Always set identity transform before setting frame;
216216
transform = nativeView.layer.transform;
217217
nativeView.layer.transform = CATransform3DIdentity;
@@ -225,7 +225,7 @@ export class View extends ViewCommon implements ViewDefinition {
225225
nativeView.frame = adjustedFrame;
226226
}
227227

228-
if (this._hasTransform) {
228+
if (this._isTransformed) {
229229
// re-apply the transform after the frame is adjusted
230230
nativeView.layer.transform = transform;
231231
}
@@ -410,9 +410,7 @@ export class View extends ViewCommon implements ViewDefinition {
410410
transform = iosUtils.applyRotateTransform(transform, this.rotateX, this.rotateY, this.rotate);
411411
transform = CATransform3DScale(transform, scaleX, scaleY, 1);
412412

413-
const needsTransform: boolean = !CATransform3DEqualToTransform(this.nativeViewProtected.layer.transform, transform) || (nativeView.outerShadowContainerLayer && !CATransform3DEqualToTransform(nativeView.outerShadowContainerLayer.transform, transform));
414-
415-
if (needsTransform) {
413+
if (!CATransform3DEqualToTransform(this.nativeViewProtected.layer.transform, transform)) {
416414
const updateSuspended = this._isPresentationLayerUpdateSuspended();
417415
if (!updateSuspended) {
418416
CATransaction.begin();
@@ -424,7 +422,7 @@ export class View extends ViewCommon implements ViewDefinition {
424422
if (nativeView.outerShadowContainerLayer) {
425423
nativeView.outerShadowContainerLayer.transform = transform;
426424
}
427-
this._hasTransform = this.nativeViewProtected && !CATransform3DEqualToTransform(this.nativeViewProtected.transform3D, CATransform3DIdentity);
425+
this._isTran 6D40 sformed = this.nativeViewProtected && !CATransform3DEqualToTransform(this.nativeViewProtected.transform3D, CATransform3DIdentity);
428426

429427
CATransaction.setDisableActions(false);
430428
if (!updateSuspended) {

‎packages/core/ui/styling/background.ios.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1114,6 +1114,7 @@ function drawBoxShadow(view: View): void {
11141114
}
11151115

11161116
outerShadowContainerLayer.bounds = bounds;
1117+
outerShadowContainerLayer.transform = layer.transform;
11171118
outerShadowContainerLayer.anchorPoint = layer.anchorPoint;
11181119
outerShadowContainerLayer.position = nativeView.center;
11191120
outerShadowContainerLayer.zPosition = layer.zPosition;

0 commit comments

Comments
 (0)
0