Fade in and fade out a UIView while it is moving

Question

It's easy enough to animate the view:

[UIView animateWithDuration:1.0
                     animations:^{theView.center = newCenter; theView.alpha = 0;}
                     completion:^(BOOL finished){
                         [theView removeFromSuperview];
                     }];

The problem is that when I add it as a subview, I want it to fade in and already look like it is moving. Right now it appears immediately, then moves and fades out.

So, I need to set it's initial alpha to zero, fade it quickly while it is moving, then fade it out. Is this possible with UIView animations? I can't have two competing animation blocks working on the same object right?

Answer 1

All you need to do is apply 2 animations back-to-back. Something like this ::

theView.alpha = 0;
[UIView animateWithDuration:1.0
                 animations:^{
                     theView.center = midCenter;
                     theView.alpha = 1;
                 }
                 completion:^(BOOL finished){
                     [UIView animateWithDuration:1.0
                                      animations:^{
                                          theView.center = endCenter;
                                          theView.alpha = 0;
                                      }
                                      completion:^(BOOL finished){
                                          [theView removeFromSuperview];
                                      }];
                 }];

So in the 1st second it will appear while moving and then in the next second it will fade out

Hope this helps

Answer 2

Put the initial alpha=0 outside animation block.

theView.alpha = 0;
[UIView animateWithDuration:1.0
                 animations:^{
                     theView.center = newCenter; 
                     theView.alpha = 1;
                 }
                 completion:^(BOOL finished){
                     // Do other things
                 }];