Animating a UIView

Question

I have an animated rectangle that grows in length:

[UIView animateWithDuration:60
                 animations:^{
                 CGRect frame = left.frame;
                 // adjust size of frame to desired value
                 frame.size.height -= 0.1;
                 left.frame = frame; // set frame on your view to the adjusted size
                 }
                 completion:^(BOOL finished){
                 // Re-start the animation if desired
                 }];

However, the rectangle will only change it's height so that it goes downwards, rather than upwards. How can I change it to make the rectangle grow upwards?

Answer 1

You are only changing the height of the frame. This will keep the same x and y origin values.

You need to change the height and the origin, like htis...

[UIView animateWithDuration:60
                 animations:^{
                     CGRect frame = left.frame;
                     // adjust size of frame to desired value
                     frame.size.height -= 0.1;
                     frame.origin.y += 0.1; // make opposite to origin as to height
                     left.frame = frame; // set frame on your view to the adjusted size
                 }
                 completion:^(BOOL finished){
                     // Re-start the animation if desired
                 }];

To Loop from Zero height to 100 height (for example)

- (void)animateHeight
{
    [UIView animateWithDuration:60
                          delay:0.0
                        options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat
                     animations:^{
                         CGRect frame = left.frame;
                         // adjust size of frame to desired value
                         frame.size.height = 100;
                         frame.origin.y -= 100; // make opposite to origin as to height
                         left.frame = frame; // set frame on your view to the adjusted size
                     }
                     completion:^(BOOL finished){
                         // animation is auto reversing and repeating.
                     }];
}