Question

我试图为一个爆破的圆圈制作动画。但是在向下缩放之后，会产生一些闪烁的效果。任何想法，为什么会这样？到目前为止，这是我的代码：

- (instancetype)init
{
    self = [super init];
    if (self) {
        if (!self.path) {
            self.path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(0, 0) radius:7 startAngle:0.0*(M_PI/180.0)  endAngle:360.0*(M_PI/180.0) clockwise:YES].CGPath;
        }

        [self animateCircleUpward];
    }
    return self;
}

-(void)animateCircleUpward {

    [CATransaction begin];
        [CATransaction setCompletionBlock:^{[self animateCircleDownward];}];

        CABasicAnimation * scaleUpwardAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale.xy"];
        scaleUpwardAnimation.fromValue = @(0.7);
        scaleUpwardAnimation.toValue = @(1.0);


        CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
        opacityAnimation.fromValue = @(1.0);
        opacityAnimation.toValue = @(0.6);
        self.fillColor = [UIColor greenColor].CGColor;

        CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
        NSArray *animations = @[scaleUpwardAnimation, opacityAnimation];
        animationGroup.duration = 0.4;

        animationGroup.animations = animations;
        [self addAnimation:animationGroup forKey:@"pulse"];

    [CATransaction commit];
}

-(void)animateCircleDownward {

    [CATransaction begin];
    [CATransaction setCompletionBlock:^{[self animateCircleUpward];}];

    CABasicAnimation * scaleDownwardAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale.xy"];
    scaleDownwardAnimation.fromValue = @(1.0);
    scaleDownwardAnimation.toValue = @(0.7);


    CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"];
    opacityAnimation.fromValue = @(0.6);
    opacityAnimation.toValue = @(1.0);
    self.fillColor = [UIColor greenColor].CGColor;

    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    NSArray *animations = @[scaleDownwardAnimation, opacityAnimation];
    animationGroup.duration = 0.4;

    animationGroup.animations = animations;
    [self addAnimation:animationGroup forKey:@"pulse"];

    [CATransaction commit];
}

@end

提前Thanx！

Answer 1

关于您的实际问题，您可能需要将CAAnimationGroup的fillMode属性设置为kCAFillModeForward。默认值为kCAFillModeRemoved，因此您可能会在Down和Up方法之间来回调用非表示层。

也就是说，您尝试创建的内容似乎是通过CATransaction的completionBlock在Up和Down方法之间来回调用的循环动画。这似乎是一种非常低效的方法;为什么不尝试更像的东西：

-(void)scaleAndOpacityAnimations
{
    CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale.xy”];
    scaleAnimation.fromValue = @(0.7f);
    scaleAnimation.toValue = @(1.0f);

    CABasicAnimation *opacityAnimation = [CABasicAnimation animationWithKeyPath:@“opacity”];
    opacityAnimation.fromValue = @(1.0f);
    opacityAnimation.toValue = @(0.6f);

    CAAnimationGroup *scaleAndOpacity = [CAAnimationGroup animation];
    scaleAndOpacity.animations = @[scaleAnimation, opacityAnimation];
    scaleAndOpacity.autoReverses = YES;
    scaleAndOpacity.repeatCount = HUGE_VALF;
    //OP had no value indicated for the duration in posted code, I’m including it here for completion
    scaleAndOpacity.duration = 0.5f;

    [self addAnimation:scaleAndOpacity forKey:@“pulse”];
}

无需在每个周期实例化新的CAAnimations即可无限次重复多次。

在简单的动画链中闪烁

1 个答案: