【问题标题】:Flickering in simple animation chain在简单的动画链中闪烁
【发布时间】:2015-12-01 06:11:30
【问题描述】:

我正在尝试为一个脉动的圆圈制作动画。但是在向下缩放之后,有一些闪烁的效果。为什么会这样?到目前为止,这是我的代码:

- (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

提前谢谢!

【问题讨论】:

标签: ios objective-c core-animation


【解决方案1】:

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

也就是说,您尝试创建的似乎是通过 CATransaction 的完成块在 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。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2011-08-31
    • 1970-01-01
    • 2014-10-30
    • 2019-03-05
    • 2012-10-16
    • 1970-01-01
    • 2011-12-02
    • 2012-03-12
    相关资源
    最近更新 更多