Question

我在尝试获取自定义UIView类以淡化它的背景时遇到了麻烦。我查看了以下StackOverflow问题，但它们似乎对我不起作用。

Fade background-color from one color to another in a UIView

How do you explicitly animate a CALayer's backgroundColor?

所以我有一个自定义UIView，用户可以在其中绘制内容。如果他们绘制的内容不正确，我想让背景颜色渐变为红色然后再变为白色。

我在自定义UIView中有这个自定义方法，名为

- (void)indicateMistake;

当我调用该方法时，我希望它执行背景色动画，所以我在方法中有这个：

CABasicAnimation* fade = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];
fade.fromValue = (id)[UIColor whiteColor].CGColor;
fade.toValue = (id)[UIColor redColor].CGColor;
[fade setDuration:3];
[self.layer addAnimation:fade forKey:@"fadeAnimation"];

但是当我这样做时，似乎没有任何事情发生。

然后我尝试了一个愚蠢的旋转动画，看看它是否有效：

CABasicAnimation* rotate = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
rotate.toValue = [NSNumber numberWithInt:M_PI];
[rotate setDuration:1];
[self.layer addAnimation:rotate forKey:@"rotateAnimation"];

出于某种原因，自定义UIView旋转。

然后阅读更多StackOverflow答案我尝试了这个：

[UIView animateWithDuration:3 animations:^{
    [self setBackgroundColor: [UIColor redColor]];
} completion:^(BOOL finished) {
    [self setBackgroundColor: [UIColor whiteColor]];
}];

立即将颜色从红色变回白色。有时它太快我有时看不到它发生。如果我注释掉[self setBackgroundColor: [UIColor whiteColor]];它会保持红色。但是节点会逐渐变为白色到红色。

我的想法已经用完了......任何帮助都会受到赞赏！

Answer 1

[UIView animateWithDuration:0.3f animations:^{
   fade.layer.backgroundColor = [UIColor redColor].CGColor;
}

假设您已将淡入淡出视图预先设置为之前想要的白色。

您最后一次尝试动画跳回白色的原因是因为在animateWithDuration的完成子句中，您将视图设置为白色。

动画完成后执行完成子句，因此动画（白红色）出现，然后编译器完成并将淡入淡出视图跳回白色。

作为额外奖励：

我相信你可能想知道如何回到白色。

好吧，我们假设按下UIButton会调用此函数，称为“animateColors”。所以说，只需实现一个BOOL。

- (void)animateColors {        
    if (!isRed) {
        [UIView animateWithDuration:0.3f animations:^{
            fade.layer.backgroundColor = [UIColor redColor].CGColor;
        }];
        isRed = YES;
    } else if (isRed) {
        [UIView animateWithDuration:0.3f animations:^{
            fade.layer.backgroundColor = [UIColor whiteColor].CGColor;
        }];
        isRed = NO;
    }
}

显然，您要在接口或头文件中创建布尔值isRed的属性声明。

Answer 2

所以我有一个自定义的UIView，用户可以在那里画画。

我认为这意味着您已经实施了-drawRect:。

IIRC，默认情况下（如果设置了UIView.clearsContextBeforeDrawing），上下文将填充视图的背景颜色，调用-drawRect:，并在屏幕上绘制生成的位图而不是背景颜色。动画这将意味着两个位图之间的动画，这不是Core Animation特别擅长的。（我在这里的细节可能是错的，但它解释了行为）。

最简单的解决方法是将背景颜色设置为[UIColor clearColor]，并为您要绘制的视图后面的视图的背景颜色设置动画。这意味着视图不需要重绘，只需在“背景”上重新编译。

Answer 3

我按原样尝试了你的代码。它完美地工作 - 它从我的视图原始的白色到红色慢慢地消失（然后跳回到白色，这是你所期望的）。所以，如果这对你不起作用，还会发生其他事情。

一个非常有用的诊断工具是提取麻烦的代码并使项目不包含任何其他内容。我所做的就是你应该做的。创建一个全新的单视图应用程序项目。现在您有了一个视图控制器及其视图。实现此方法：

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];
    CABasicAnimation* fade = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];
    fade.fromValue = (id)[UIColor whiteColor].CGColor;
    fade.toValue = (id)[UIColor redColor].CGColor;
    [fade setDuration:3];
    [self.view.layer addAnimation:fade forKey:@"fadeAnimation"];
}

运行项目。褪色效果很好。所以你看，无论出现什么问题都不在这个代码中！它在别的地方。也许你还有其他的代码也在处理这种颜色 - 一种破坏这种颜色的不同动画。也许一些参考并不是指你的想法。也许某些东西覆盖了层，所以你看不到它（一个子层）。谁知道？你没有展示你的整个项目（你也不应该）。重要的是向自己证明代码应该工作，这样你才能弄清楚真正错误是什么。而且我已经告诉你如何做到这一点。

如何淡化UIView背景色 - iOS 5

3 个答案: