Sequence of affine transformation with Quartz 2D

Question

I'm attempting to simulate the incorrect password entry animation in OS X with an UIAlertView in iOS. Essentially I want it to translate the alert left then translate right. Here is what I am doing:

    [UIView animateWithDuration:0.5 
                 animations:^{
                     alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, 200, 0);
                     alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, -200, 0);
                 }];

This doesn't have the desired effect however. The alert shoots of to the right instantaneously and then smoothly translates to the left. How can I get both of the translations to occur smoothly after each other?

Answer 1

Try this:

[UIView animateWithDuration:0.5 animations:^{

        alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, 200, 0);

    } completion:^(BOOL finished) {

        [UIView animateWithDuration:0.5 animations:^{
            alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, -200, 0);
        }];
    }];

But I would do the animation like this:

[UIView animateWithDuration:0.1 animations:^{

        alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, 20, 0);

    } completion:^(BOOL finished) {

        [UIView animateWithDuration:0.1 animations:^{

            alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, -20, 0);

        } completion:^(BOOL finished) {

            [UIView animateWithDuration:0.1 animations:^{
                alertView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, 0, 0);
            }];

        }];
    }];

Up to you! ;-)