如何在 UIImageView 旋转期间动态调整阴影?

发布于 2024-11-29 07:20:01 字数 938 浏览 2 评论 0原文

我使用以下代码来添加投影:

letterE.layer.shadowColor = [[UIColor blackColor] CGColor];
letterE.layer.shadowOffset = CGSizeMake(2.5, 2.5);
letterE.layer.shadowRadius = 3.0;
letterE.layer.shadowOpacity = 0.95;

并使用以下代码来旋转:

CABasicAnimation* rotationAnimation;
rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
rotationAnimation.toValue = [NSNumber numberWithFloat: M_PI * 2.0];
rotationAnimation.duration = 5.0;
rotationAnimation.cumulative = YES;
rotationAnimation.repeatCount = 1.0; 
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];

[letterE.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];

在动画期间,阴影是静态的,看起来很奇怪:

在此处输入图像描述 在此处输入图像描述

如何使阴影在动画过程中动态更新?

I use the following to code to add drop shadow:

letterE.layer.shadowColor = [[UIColor blackColor] CGColor];
letterE.layer.shadowOffset = CGSizeMake(2.5, 2.5);
letterE.layer.shadowRadius = 3.0;
letterE.layer.shadowOpacity = 0.95;

and the following to rotate:

CABasicAnimation* rotationAnimation;
rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
rotationAnimation.toValue = [NSNumber numberWithFloat: M_PI * 2.0];
rotationAnimation.duration = 5.0;
rotationAnimation.cumulative = YES;
rotationAnimation.repeatCount = 1.0; 
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];

[letterE.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];

During the animation, the shadow is static which looks weird:

enter image description here enter image description here

How can I make the shadow dynamically updated during the animation?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

空城之時有危險 2024-12-06 07:20:01

我发现这很有趣,所以我尝试了一下。一种可能的解决方案是在主视图下构建第二个清晰视图,使用原始视图的路径为其(底部视图)提供阴影。然后您可以将动画应用到两个视图。我使用简单的矩形视图完成了此操作,但我认为没有理由不能使用更复杂的路径或使用 2 个 CALayers 而不是 2 个 UIView 来完成此操作。

这就是我设置视图的方式...

testView = [[UIView alloc] initWithFrame:CGRectMake(40, 40, 100, 100)];
testView.backgroundColor = [UIColor redColor];

//increase y origin of second view to simulate shadow offset
testViewShadow = [[UIView alloc] initWithFrame:CGRectMake(40, 50, 100, 100)];

CGMutablePathRef path = CGPathCreateMutable();
CGPathAddRect(path, NULL, CGRectMake(0, 0, testView.frame.size.width, testView.frame.size.height)); 
testViewShadow.layer.shadowPath = path;
testViewShadow.layer.shadowOpacity = 1.0;
testViewShadow.layer.shadowOffset = CGSizeMake(0, 0);
testViewShadow.layer.shadowRadius = 10.0;
CFRelease(path);

[self.view addSubview:testViewShadow];
[self.view addSubview:testView];

以及我的动画(只需将 CAAnimation 作为 IBAction 连接到按钮并应用于两个视图)...

- (IBAction)rotate:(id)sender{
    CABasicAnimation* rotationAnimation;
    rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotationAnimation.toValue = [NSNumber numberWithFloat: M_PI * 2.0];
    rotationAnimation.duration = 5.0;
    rotationAnimation.cumulative = YES;
    rotationAnimation.repeatCount = 1.0; 
    rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];

    [testView.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];
    [testViewShadow.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];
}

这就是结果的样子...

在此处输入图像描述 输入图像描述这里

任何(2D)变换都应该如果将它们应用到这两种视图中,看起来会很可信。

希望有帮助!

I found this interesting so I gave it a shot. A possible solution is to build a second clear view under the main view, giving it (the bottom view) a shadow using the original view's path. Then you can apply the animation to both views. I did this with simple rectangular views but I see no reason why this can't be done with more complex paths or using 2 CALayers instead of 2 UIViews.

This is how I set up my views...

testView = [[UIView alloc] initWithFrame:CGRectMake(40, 40, 100, 100)];
testView.backgroundColor = [UIColor redColor];

//increase y origin of second view to simulate shadow offset
testViewShadow = [[UIView alloc] initWithFrame:CGRectMake(40, 50, 100, 100)];

CGMutablePathRef path = CGPathCreateMutable();
CGPathAddRect(path, NULL, CGRectMake(0, 0, testView.frame.size.width, testView.frame.size.height)); 
testViewShadow.layer.shadowPath = path;
testViewShadow.layer.shadowOpacity = 1.0;
testViewShadow.layer.shadowOffset = CGSizeMake(0, 0);
testViewShadow.layer.shadowRadius = 10.0;
CFRelease(path);

[self.view addSubview:testViewShadow];
[self.view addSubview:testView];

..and my animation (just hooked up your CAAnimation to a button as an IBAction and applied to both views)...

- (IBAction)rotate:(id)sender{
    CABasicAnimation* rotationAnimation;
    rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
    rotationAnimation.toValue = [NSNumber numberWithFloat: M_PI * 2.0];
    rotationAnimation.duration = 5.0;
    rotationAnimation.cumulative = YES;
    rotationAnimation.repeatCount = 1.0; 
    rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];

    [testView.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];
    [testViewShadow.layer addAnimation:rotationAnimation forKey:@"rotationAnimation"];
}

This is what the result looks like...

enter image description here enter image description here

Any (2D) transformations should look believable if you apply them to both views.

Hope that helps!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文