CODEWITHSUNDEEP
iosuiviewanimationcaanimation
shannoga
shannoga

Reputation: 19869

CAAnimation layer cancels previos transformation of the view

I am using a simple transformation animation to an UIIMageView.

    [UIView animateWithDuration:2 delay:0 options:UIViewAnimationOptionBeginFromCurrentState|UIViewAnimationOptionCurveEaseInOut animations:^{
        CGAffineTransform translate = CGAffineTransformMakeTranslation(0, -[self percentFromHeight:20]);
        clueImage.transform = translate;
    } completion:^(BOOL finished) {
        [self.cluWordSelectionView setaWordsObjects:[NSArray arrayWithArray:[self.whiteCard clueWordObjectsForSoundAtIndex:self.index]]];

        [self addSubview:cluWordSelectionView];
        [clueImage.layer addAnimation:[Animations shakeAnimation] forKey:@"shake"];

    }];

As you can see after the completion I am adding an other shake animation to the view:

[clueImage.layer addAnimation:[Animations shakeAnimation] forKey:@"shake"];

Which looks like that:

+(CAAnimation*)shakeAnimation {

CAKeyframeAnimation* animation = [CAKeyframeAnimation animationWithKeyPath:@"transform"];

CGFloat wobbleAngle = 0.06f;

NSValue* valLeft = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(wobbleAngle, 0.0f, 0.0f, 1.0f)];
NSValue* valRight = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(-wobbleAngle, 0.0f, 0.0f, 1.0f)];
animation.values = [NSArray arrayWithObjects:valLeft, valRight, nil];
animation.beginTime = 3;
animation.autoreverses = YES;  
animation.duration = 0.125;
animation.repeatCount = HUGE_VALF;  

return animation;

}

The problem is that when the shakeAnimation starts the view "jumps" back to it's original position. How can I prevent that and Why this is happening?

Thanks

shani

Upvotes: 0

Views: 454

Answers (1)

sch
sch

Reputation: 27506

The new animation should take the current transform (translation) into account:

    CATransform3D leftTransform = CATransform3DMakeRotation(wobbleAngle, 0.0f, 0.0f, 1.0f);
    leftTransform = CATransform3DConcat(layer.transform, leftTransform);
    CATransform3D rightTransform = CATransform3DMakeRotation(-wobbleAngle, 0.0f, 0.0f, 1.0f);
    rightTransform = CATransform3DConcat(layer.transform, rightTransform);

    NSValue* valLeft = [NSValue valueWithCATransform3D:leftTransform];
    NSValue* valRight = [NSValue valueWithCATransform3D:rightTransform];

Where layer is the layer that will be animated.

Upvotes: 1

Related Questions