CODEWITHSUNDEEP
ioscore-animationtransformation
GaberT
GaberT

Reputation: 51

CGAffineTransformScale and Animation not working as expected

I am creating a storybook app, which is essentially as series of short animations. Each "page turn" is just a short animation where the page zooms out. For page1, the animation works as expected, however, for page2, if I call the action page2 while the first animation is still in progress, it seems to jump in right where page1 is at that moment, ignoring it's own duration, delay, etc.

Ideally, I'd like the animation page2 to play as it's own zoom out, the same way, no matter when it is called, what might I change in this code.

-(IBAction) page1
{
    pageImageNext.bounds = CGRectMake(-240, -370, 1200, 800);

    [UIImageView animateWithDuration:7.5 delay:2.0 options: UIViewAnimationOptionOverrideInheritedDuration |
                                                            UIViewAnimationOptionAllowUserInteraction animations:^{
        CGAffineTransform zoom = CGAffineTransformScale(CGAffineTransformIdentity, .4, .4); 
        self.pageImageNext.center = CGPointMake(240,160);
        self.pageImageNext.transform = zoom;

    } completion:^(BOOL finished) {}];
}

-(IBAction) page2
{
    pageImageNext.image = [UIImage imageNamed:@"page2.jpg"];
    pageImageNext.bounds = CGRectMake(-240, -370, 1200, 800);

    [UIImageView animateWithDuration:7.5 delay:6.0 options: UIViewAnimationOptionOverrideInheritedDuration |
                                                            UIViewAnimationOptionAllowUserInteraction | 
                                                            UIViewAnimationOptionBeginFromCurrentState animations: ^{
        CGAffineTransform zoom2 = CGAffineTransformScale(CGAffineTransformIdentity, .4, .4);    
        self.pageImageNext.center = CGPointMake(240,160);
        self.pageImageNext.transform = zoom2;

    } completion:^(BOOL finished) {}];
}

In addition the line pageImageNext.bounds = CGRectMake(-240, -370, 1200, 800); seems to have no effect in page2, as it isn't resizing the UImageView, but rather seems to "inherit" it's current size from the previous transformation.

Thanks!

Upvotes: 2

Views: 3425

Answers (1)

GaberT
GaberT

Reputation: 51

I haven't actually figured out what was going wrong in the above, though I have figured out that by using Core Animation, I do get the correct effect, by using this code in each IBAction:

pageImageNext.image = [UIImage imageNamed:@"page1.jpg"];
pageImageNext.bounds = CGRectMake(-240, -470, 1200, 800);

CABasicAnimation *zoomOut = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
zoomOut.beginTime = CACurrentMediaTime()+4;
zoomOut.toValue = [NSNumber numberWithDouble:0.4];
zoomOut.duration = 8.0;
zoomOut.fillMode=kCAFillModeForwards;
zoomOut.removedOnCompletion=NO;
[pageImageNext.layer addAnimation:zoomOut forKey:@"zoomOut"];

Upvotes: 3

Related Questions